HTML/CSS
基础知识
- HTML 超文本标记语言
- 语法松散---标准低,不利于规范(学习曲线陡峭)
- html 4.01(1999.12) --- html5(2014.10)
HTML解析
- 词法分析: 把字符流初步解析成我们可理解的“词”
- 语法分析: 把开始结束标签配对,属性赋值好,父子关系链接好,构成dom树
语义化
- strong这类表现式标签,修改的时候需要改动dom,维护成本高
- 不推荐tag标签来做选择器,因为会变成全局样式,尽可能让样式的作用域小
- html5标签做兼容问题,自己研究
为你的网页引入CSS
- link外链样式有诸多好处,代码解耦,维护性高,可复用,前后端分离等
- 但是当访问量巨大时,要向性能做妥协。需要将css,js嵌入页面,让页面尽可能快加载,当然这是特殊情况。
元素类别
- 块元素:disaplay:block。独占一行
- 块级元素: 包含块元素,例如 display:table
- 内联元素:display:inline
- 内联级元素: 包含内联元素
块级元素 vs 宽100%
- 块级元素特征,体现在盒模型的差异
- 盒模型: margin+border+padding+content
早期支持padding,只有table-cell - box-sizing: border-box;w3c盒模型
box-sizing: content-box;ie盒模型
嵌套三元素 ---w3c规范
- 元素类别
- 元数据元素
- 流式元素
- 章节元素
- 标题元素
- 叙述元素
- 嵌入元素
- 交互元素
- 元素上下文
- 内容模型:决定子元素的类型
<a>标签可以包含除自己以外的任何标签,它是被忽略的。
旧规则是a(inline元素)下不包含div(block元素),实际上根据w3c规范下是可行的。不过依然推荐采用约定俗成的代码习惯
沿着X、Y轴倾斜转换:skew(20deg,20deg)
前景图: img标签,用来表达页面的内容,需要传达给用户的
背景图: css样式,用来做装饰
with:auto 兼容ie
低级错误更难检测,比如使用中文“”,还有单引号等。
网友评论