html5 день6

Day6
Webpage Layout:
Как центрировать версию по центру? ?
Добавьте поле: 0 auto к центру элемента для центрирования;

css list attribute:
list:
ul (упорядоченный список)
ol (неупорядоченный список)
dl (произвольный список)
символ списка для списка исследований.
1: list-style-type:
круг полый круг
квадрат маленький черный квадрат
нет очистить символ списка

2:  list-style-image: url(路径)
        把一张图片当作列表符号

3:     list-style-position:
        inside    (内容区域里面)
        outside   (内容区域外面)
        
4: list-style:none;(重点    清除列表符号)

CSS-атрибут border:
border: 10px, сплошной красный; (сокращенное \ составное написание)

    border-width:10px;
    border-style:solid;
    border-color:red;

    常用的线条类型:solid(实线)  dashed(虚线)  dotted(点状线)  double(双线) none(没有)

1:给单一方向添加边框。
    border-left:10px solid red;
    border-right:10px solid red;
    border-top:10px solid red;
    border-bottom:10x solid red;

2: border的其他设置方法:
    border-width\border-style\border-color  
    这三个属性能单独拿出进行设置。
    这三个属性每个最多能接收4个属性值。 
        border:10px solid;
        border-color:  1到4个属性值。
            1个属性值:  四周
            2个属性值:  上下   左右
            3个属性值:  上    左右   下
            4个属性值:  上右下左
            
3: 用css实线一个三角形。
    颜色值为透明:  transparent;

background:; Составной атрибут
1: Цвет фона:
background-color:;

2: 背景图:
    background-image:url(路径);
    背景图的显示状态:
        1: 背景图是不占据空间的。
        2: 背景图大小 小于 容器大小的时候,直到铺满为止
        3: 背景图大小 等于 容器大小的时候,正好显示一张
        4: 背景图大小 大于 容器大小的时候,只显示容器区域
3:控制背景图是否平铺
    background-repeat:;
        属性值:
            repeat      平铺(默认值)
            no-repeat   不平铺
            repeat-x    横向平铺
            repeat-y    纵向平铺
4: 控制背景图的位置:
    background-position:;
        属性值:
            第一个值:水平的位置   第二个值:垂直的位置
            eg:
                100px 200px    ->   距离左侧100px,距离顶端200px
                -100px -30px   ->   往左移动100px,往上移动30px;
                10%   20%      ->   支持百分比
                left  bottom   ->   让背景图的左侧和底部,贴着容器的左侧和底部
                right center   ->   让背景图右侧贴着容器右侧,上下居中
                center bottom  ->   左右居中,背景图底部贴着容器底部
                center         ->   水平和垂直都居中

5: 背景图的固定:
    background-attachment:;
        属性值:fixed/scroll;
简写:background:red url(背景图的路径) no-repeat 200px bottom;

Модель css box:
это краеугольный камень макета веб-страницы! Коробка модель, изнутри наружу , содержащий:
область содержимого
внутри прокладки (прокладки)
установочной коробка (дополнительно)
полей
использовать обивку:
. 1: длина между подкладкой и содержимым коробки, внутри коробки.
2: отступ - для регулировки позиционных отношений дочернего элемента в родительском элементе.
3: характеристики заполнения: значение заполнения будет поддерживать поле.
4: Если вы хотите сохранить исходный размер поля, вам нужно вычесть значение отступа на основе ширины и высоты.
5: Установите значение отступа для одного направления:
отступы влево / вправо / верх / низ:;
6: метод настройки заполнения:
заполнение: 1 значение вокруг
отступа: 2 значения вверх и вниз и влево и вправо
: 3 значения вверх и вниз, а также левое и правое
заполнение: 4 Значение вверху справа внизу слева

    7: padding不能设置负值
    8: padding不会对背景图造成影响。
    9:如果一个盒子没有设置固定的宽和高,添加padding是不用减的。
Опубликовано 21 оригинальных статей · понравилось 0 · посещения 290

рекомендация

отblog.csdn.net/jiatinghui/article/details/105059675
рекомендация