css元素及快捷键保姆级教学

快捷键组合：

1.！：代表生成html骨架元素

2.html元素直接书写html元素名称

3.{}：书写html元素名称内容，更多配合2.4快捷键使用

4.*：批量生成相同元素

5.>：生成html的下一级子元素

6.+：批量生成不同元素

7. .class属性值：添加class属性值，连续，可以同时添加多个class属性值

8.#id属性值：添加id属性值

9.（）：代表快捷键组合

各类标签

h1：几级标题（h1，h2，h3...h1最大）

 hr：加一个线

 span：形成最基本的元素独立空间，横向排列

 div：竖着的基本元素的独立空间

 p：竖着的带一点换行的段落独立空间

a标签：超链接

 href属性：指定页面资源路径，网络资源，本地资源

 traget：设置页面打开的方式_self（默认，本窗口）_blank（新窗口）_top（顶级窗口）_parent（父级窗口）

 a标签:锚点

 name：锚点名称，跳转锚点需要href超链接里面加#

 列表标签

 1.无序列表 ul

   子元素 li

2.有序列表 ol

  子元素 li

  相关属性 start：表示起始值

  type：次序的类型

3.描述列表 dl

  子元素 dt 描述的标题 dd 描述的详情

图片元素 img

  src：设置图片资源路径

  alt：设置图片不能正常加载时的文字说明

  width：图宽

  height：图高

  如果必须从图片设置宽高，只能单方向设置不然会变形

  如果按照图片不变型的形况下改变长宽，就要借助css object-fit：cover

表格元素 table

   属性元素：border 边框

            cellpadding 设置单元格内填充

            cellspacing 设置单元格间空隙

            width 设置表格的边框，默认是内容撑起来的宽度

            align：设置表格本身对齐方式

       子元素：

       caption：表格标题

       col：虚拟列

       相关属性

       span：设置合并的列数

          tr：代表行

              子元素：

              td：代表单元格

              属性 width，align

              rowspan：设置单元格合并的行数

              colspan：设置单元格合并的列数

              th：代表标题单元格（居中，加粗）

              相关属性

              width，align

              rowspan：设置单元格合并的行数

              colspan：设置单元格合并的列数