CSS Фон (Background)
CSS свойства фона используются для определения фона HTML-элементов.
Свойства CSS определяют фоновые эффекты:
- цвет фона
- Фоновое изображение
- фон-повторить
- фон-вложение
- фон положение
Цвет фона
цвет фона свойство определяет цвет фона элемента.
Цвет фона страницы, чтобы использовать в селекторе тела:
CSS, значения цвета обычно определяются следующим образом:
- Hex - такие, как: "# ff0000"
- RGB - такие, как: "RGB (255,0,0)"
- Названия цветов - такие, как: "красный"
В следующем примере, h1, р и DIV элементы имеют разные цвета фона:
примеров
p {background-color:#e0ffff;}
div {background-color:#b0c4de;}
Попробуйте »
фон изображения
Атрибут фоновое изображение описывает элементы фонового изображения.
По умолчанию, фоновое изображение плиточным многократно отображается, чтобы охватить весь элемент сущности.
Page примеры настройки фонового изображения:
Ниже приведен пример плохой сочетания текста и фонового изображения. Текст плохой читаемости:
Фоновые изображения - горизонтальные или вертикальные плиточные
По умолчанию свойство фоновое изображение облицована в горизонтальной или вертикальной ориентации страницы.
Если некоторые изображения черепицей по горизонтали и по вертикали, так что она выглядит очень скоординированные, следующим образом:
Если изображение плитки (повтор-х) только в горизонтальном направлении, фон страницы будет лучше:
Фоновое изображение - Установить положение и не плитка
Пусть фоновое изображение не влияет на расположение текста
Если вы не хотите плитки изображения, вы можете использовать фон-повторить свойство:
В приведенном выше примере, фоновое изображение и текст появится в том же месте, с тем чтобы сделать макет страницы более разумным, не влияет на чтение текста, мы можем изменить расположение изображения.
Фон-позиционный свойство может быть использовано для изменения изображения на заднем плане здесь:
примеров
{
background-image:url('img_tree.png');
background-repeat:no-repeat;
background-position:right top;
}
Попробуйте »
Фон - сокращённое свойство
В приведенном выше примере, мы можем видеть цвет фона страницы через множество атрибутов для управления.
Для упрощения кода этих свойств, мы можем использовать эти атрибуты объединены в одном собственности.
Стенография цвет фона недвижимости для «фона»:
При использовании сокращённого свойства, порядок значений атрибутов, как ::
- цвет фона
- Фоновое изображение
- фон-повторить
- фон-вложение
- фон положение
Все эти атрибуты не нужно использовать, вы можете использовать в соответствии с реальными потребностями страницы.
В этом примере используется CSS описано выше, вы можете просмотреть экземпляр: Примеры CSS
Другие примеры
Как установить фиксированное фоновое изображение
Этот пример показывает, как установить фиксированное фоновое изображение. Изображение не будет прокручиваться с остальной части страницы.
Свойства CSS фона
| Property | 描述 |
|---|---|
| background | 简写属性，作用是将背景属性设置在一个声明中。 |
| background-attachment | 背景图像是否固定或者随着页面的其余部分滚动。 |
| background-color | 设置元素的背景颜色。 |
| background-image | 把图像设置为背景。 |
| background-position | 设置背景图像的起始位置。 |
| background-repeat | 设置背景图像是否及如何重复。 |