2021-07-29

块属性标签
        1.独占一行(上下排列)
        2.支持设置宽高 不设置宽高情况下 高度内容撑开 宽度撑满父容器

标题标签 h1~h6
        h1标签只能写一个

列表标签一般不单独使用

无序列表：<ul><li></li></ul>

有序列表：<ol><li></li></ol>

把标签转化为块属性:display: block;
把标签转化为行块属性:display: inline-block;

把标签转化为行属性:display: inline;
隐藏:display: none;

行块属性标签 既可以设置宽高 又排在一行(作用排列)
        图片
        src属性是图片的路径 可以是服务器地址 也可以是相对路径
        alt属性：图片加载失败显示的内容
        title属性：鼠标悬停后显示内容

标签选择器 选中页面中所有此类标签权重为1

id选择器
            id名是唯一的 一个标签只能有一个id 不同标签id也不可以相同权重为100

class选择器
            不同标签可以使用相同的class名
            一个标签可以有多个class名
            class选择器权重是10

让行属性元素支持宽高
                display: inline-block;
 浮动：left、right
                让块属性元素排成一行的时候使用浮动
                碰到父元素边缘会停下来

当父元素不设置高度 高度由子元素撑开的时候
        一旦子元素浮动 就会脱离父元素 父元素就会失去高度 进而影响后面元素布局
        解决：
        1.给父元素设置overflow:hidden;
        2.在父元素最后加一个设置了clear: both;块属性元素

透明度 0-1（默认是1）
                透明度会继承给子元素
                opacity: .5;

16进制
                background-color: #00FFFF;
                英文单词
                background-color: aqua;
                rgb值 每个值都在0-255之间

背景图片
                background-image

背景图片大小
                一个值 横向固定 纵向自适应
                两个值 横向和纵向大小
                cover 等比例平铺 会切掉一部分
                contain 宽度或者高度等比例自适应 可能撑不满

背景是否重复
                background-repeat: no-repeat;

背景图片位置
                左上角是0,0点 x向右正方向 y向下正方向
                两个值 x轴方向偏移量 y方向偏移量
                x轴 left right center
                y轴 top bottom center