Оформление границы CSS

Как задать границы в css.  Для любого элемента на веб-страницы, вы можете установить границу.
Я уже писала о том, как менять border, используя встроенный css (что такое встроенный стиля читайте в статье основы css).
Однако часто нам нужно задавать границы и изменять его свойства не только при оформлении записи, но и применять границы в оформлении блога. В этом случае применяют правила css.
Пример применения стилей border для заголовка h1:

Свойства border:

1. border-width – толщина границы,
2. border-style – стиль. Возможные значения:
• dotted – точечная,
• dashed – пунктирная,
• solid – сплошная,
• double - двойная,
• groove – бороздка, трехмерная граница,
• ridge – “гребень”,
• inset - вдавленная,
• outset - выпуклая.
3. border-color – цвет границы.
4. border-image – граница в виде изображения. Не отображается в старых браузерах. Для обеспечения совместимости с другими браузерами нужно прописать отдельно для
• Mozilla firefox  свойство -moz-border-image,
• для safari, chrome, Android и iOS   -webkit-border-image,
• старые версии Оперы -o-border-image

/*
Возможно применить границу только с одной или нескольких определенных сторон или стилизовать стороны по-разному:

• border-top – верхняя граница,
• border-right – правая,
• border-bottom – нижняя,
• border-left – левая.

Еще один пример применения border стилей:

Сокращенная запись border:

Таким образом. сначала записывается ширина, затем стиль и только после них идет цвет границы.
Пример оформления цитаты с помощью границы:
blockquote { border: 2px solid #ff0; }