HTML+CSS核心整理
2019-05-28 14:23:31 0 举报AI智能生成
HTML+CSS核心知识点整理. 微信公众号:编程之夜
作者其他创作
大纲/内容
静态HTML
HTML
<标签 HTML属性=\"值\" >内容</标签>
HTML属性
其他
和CSS有关
style
知道行内样式怎么转换为CSS选择器样式写法
id
class
和样式有关的尽量用CSS属性，取代以前不存在CSS时的控制样式的HTML属性
知识点
HTML的层次结构(包含关系)
什么是子元素，父元素，祖先元素
你的代码没有层次缩进感一看就不行
常见HTML元素
块元素
常见的块元素有哪些
div、ul、li、p、h1~h6、table、tr、td<br>
行元素
常见的行元素有哪些
span、a、img、input、button、i、b、
p标签不能包裹p标签，这是一个非常特殊的禁止用法
块元素、行元素的区别是什么
思考：为什么构成网页的基础是HTML标签语法，而没有用微软的word这种格式
对比:在网页表格中批量插入图像，和在EXCEL对比体会
CSS
选择器{ CSS属性:值; }
选择器
id选择器
#
class选择器
.
子代选择器
后代选择器
CSS属性
值
存在多值的属性写1~4个值简写对应的作用
长度单位
固定长度
px
相对长度
rem
相对于根元素html的大小，即font-size属性，默认是16px
CSS盒模型
内容宽度
width
默认元素内边距、边框、外边距为0时，width属性的值=占据空间宽度
内边距
padding
边框
border
外边距
margin
盒子的内容区域宽度由什么属性决定
盒子的可见区域由哪些属性决定
盒子占据空间的宽度如何计算
布局和定位
影响布局
display
block
让元素表现为块元素<br>
inline<br>
让元素表现为行元素
inline-block
让元素表现为行内块元素，
用该属性让元素水平排列存在缺陷，欢迎探索发现<br>
flex
让元素表现为弹性元素
该属性设置在容器(父元素)上，而不是子项
理解容器和子项的概念，了解哪些属性作用在容器、哪些在子项
主轴和交叉轴
让子项垂直水平居中
float
尽量不要用浮动属性布局，因副作用过大，推荐用flex
决定定位
position
什么是相对定位和绝对定位，它们的参照物是
z-index
Z轴叠放层级
知道元素在标准文档流和脱离文档流的区别
0 条评论
回复 删除
下一页
