01 02 03 04 05 06 07
★ Owner: Kayla
★ Opened: 06/09/17
★ Program: Photoshop CC 2020
★ Version: 13
★ Started Sw: 2005ish
★ Host: Myself
★ Credits: x
home content tutorials holiday contact ov

website blockquote tutorial

This is an example of a blockquote

the steps

1. Copy and paste this coding into your style.css page. This is one of my more basic setups for the website blockquote. You can add/delete stuff if you want. I'll list a few random coding below like a border and all that fancy shit just incase you want to add a little something to it.

I don't suggest touching the text-align or position coding in this, but you can if you want to play around. I mean how else will you learn really?

Here is some stuff you can add to it!
  • border-left: 5px solid #fb87d4; This will add a border to the left of your blockquote. Change the border color # to match your stylesheet. Change left to right if you want it on the right. Change the word solid to double if you want double lines instead of one single line
  • border: 5px solid #aaa; This will add a border around the entire blockquote. Change the px size
  • border-radius: 5px; This will add rounded corners to the entire blockquote
  • border-top-left-radius: 5px; This will add a rounded corner for the top left of the blockquote. You can change this to stuff like bottom-left or top-right and so on.

  • check out this page to understand the padding used in this coding! (scroll down on the page)

    There is so much more you can add to these, but this is pretty general to get you going!