2014-02-18

Границы css

border css
Как задать границы в css.  Для любого элемента на веб-страницы, вы можете установить границу.
Я уже писала о том, как менять border, используя встроенный css (что такое встроенный стиля читайте в статье основы css).
Однако часто нам нужно задавать границы и изменять его свойства не только при оформлении записи, но и применять границы в оформлении блога. В этом случае применяют правила css.
Пример применения стилей border для заголовка h1:
border css заголовка h1
Свойства border:
  1. border-width – толщина границы,
  2. border-style – стиль. Возможные значения:стили border css
    • 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 стилей:
пример границ для div
Сокращенная запись border:
Сокращенная запись border
Таким образом. сначала записывается ширина, затем стиль и только после них идет цвет границы.
Пример оформления цитаты с помощью границы:
blockquote { border: 2px solid #ff0; }

Комментариев нет :

Отправить комментарий

Комментарии, содержащие ненормативную лексику, спам, оскорбления, публиковаться не будут. Ели вы хотите опубликовать код в комментарии, то воспользуйтесь encoder HTML
Публикуя комментарии, вы соглашаетесь с политикой конфиденциальности