2020.4.6 HTML

发布于 2020-04-06  14 次阅读


1.复习内容

2.灵感代办

  • Emmet的使用

https://www.jianshu.com/p/7fa1aa322cad

https://www.cnblogs.com/summit7ca/p/6944215.html

https://github.com/wagnlinzh/wagnlinzh.github.io/wiki/Emmet使用手册

3.学习内容

标签

分两类标签:

双标签<html> </html> ,
和单标签 <br>,可以手动添加闭合 <br / >

  • 注释标签格式: < !-- 注释 -- >
  • html不区分大小写

标签属性

可以由多个属性,由属性名和属性值组成

标签嵌套

  • 嵌套结构中,外层元素称为父元素,内层元素称为子元素;
  • 多层嵌套结构中,所有外层元素统称为祖先元素,内层元素统称为后代元素
  • 平级结构互为兄弟元素 ## html文档
  • 两部分:头 ( head) 和 主体( body )
  • < !doctype html> 用来声明文档 ## html文档头部
  • 就是浏览器的标签卡(图标,标题)
  • 设置网页资源文件,放在头部引入
  • < head></head> ## meta标签
  • 放在head标签中的信息
  • 可以设置附加信息,编码,关键字,描述,开发信息

常用标签

1. 标题标签

  • H1-H6标签

2. 段落标签

  • p

3. 普通文本标签

  • span,b,strong,label,i,u,em斜体

4.格式标签

  • br,hr

5.字符实体

  • 使用 &lt; 在页面中呈现 "<"
  • 使用 & gt; 在页面中呈现 ">"
  • 使用 & nbsp; 在页面中呈现一个空格
  • 使用 & copy; 在页面中呈现版权符号"©"
  • 使用 & yen; 在页面中呈现人民币符号"¥"

6.容器标签

  • div,span

<tbody > 标签 渲染在浏览器窗口中

  • 网页主题:所有想要在浏览器展示的应该都写在body中 ## < body > 常用标签 ### 链接
  • 两个属性值:target是打开方式,href是打开地址
  • 特殊取值

    超链接,锚点,电话邮箱,协议限定符
    < a href="" > < /a >
    刷新网页
    < a href="#" > < /a >
    可以跳转到html中name属性的位置,
    < a href="javascript:void(0);" > < /a > 协议限定符,可以在里面直接写javascript脚本
    阻止默认跳转(浏览器的href会刷新地址,所以不阻止永远不能执行自定义)用来自定义点击事件

表格

列表标签

​ < ol> < ol> 有序标签
​ < ul> < ul> 无序标签
​ < li> < li> 标签项

表格分为三部分

  • table(表格)
  • tr(单元格) :table row
  • th(加粗,表头) / td(正常)

单元格合并clospan:跨行合并

  • clospan:跨行合并
  • rowspan:跨列合并
  • 无单位的数值,表示包含自身,占用几个单元格的位置

表格行分组(动态添加表格)

  • 可以将表格中的若干行,划分为一组,表头表尾表格主体
  • 默认情况下,所有的行都会被添加到tbody(表格主体)中显示

表格的表头,表尾,表格主体

加载顺序不影响显示内容,为了优化,应该让表格主体最后加载
  • thead划分表头
  • tfoot是表尾
  • tbody是表格内容

4.扩展延伸知识

chrome中审查元素出现的 == $0

代表当前正在查看的元素

如何在markdown中写实体符号

http://winmay.github.io/markdown/2017/06/15/markdown%E5%A6%82%E4%BD%95%E6%98%BE%E7%A4%BAHtml%E7%89%B9%E6%AE%8A%E7%AC%A6%E5%8F%B7.html

&amp的意思

&amp中的amp就是英文ampersand的缩写,该词的意思是&这个符号
& 是 HTML 中 & 的表示方法.即在html中用&表示&符号

在html中,空格,换行代表的是?

在html中代表分隔符 分割英文单词

HTML列表 ol 的属性

  • type : a , 1, I
  • start : 从多少开始排序
  • reserve :翻转排序

HTML列表 ul 的属性

  1. ul非常常用,div span和ul是最常见的三元素
  • type:属性

HTML Emmet使用方法

  • 后代:> 从大到小
  • 兄弟:+ 平级标签
  • 上级:^ 与标签的上一级同级(兄弟)
  • 分组:() 用来区分顺序,优先级
  • 乘法:* 元素重复生成多个
  • 自增:$ 用来占位,自动生成元素+数字 (id1,id2,id3)指定数字用 $@200 就是从200开始
  • ID和类:#id,.class 多个类嵌套可以直接写.class.class.class
  • 自定义属性:p[title = “value”]
  • 文本:a{“文本内容”}
  • HTML 所有未知缩写都会转换为标签
  • 隐式标签,比如#id,就是div id=“id”

5.知识内容个人梳理

6.今天都复习了之前的什么内容


Ares个人进阶之路