html5
列表
使用场景:多个相似结果
分类:有序、无序、自定义
无序
有序
span和p的区别
p标签是块元素,span标签行元素,行内元素即和其他行内元素排成一行,宽度随着内容变化而变化
元素的分类
- 行内[内联]元素(不独占一行,w、h无效,marging上下无效)
<span><a><em><input><img>
- 块级元素(会独占一行,所有的css都有效)
<div><p>、<body>、<h1-h6><ul><ol><li><dl><dt><dd><table><form>
- 行内块元素(不会独占一行,css都有效)
display
控制是否需要显示,若不需要显示即设为=none;
元素分类的转换(例如:<a>变成块级元素->display=”block”,行内块=”inline block”)
<form>提交数据到服务器
method 请求方法:get post
- get从服务器获取;参数会拼接在URL后面【..?参数名1=参数值,....】相对不安全,大小有限制
- post 提交数据到服务器;参数是放在请求体中;相对安全;无限制(比如上传文件)
CSS层叠样式表——美化html
特点:减少带宽提高速度、和数据分类、复用等
优先级
- id选择器
- 类选择器
- 标签选择器
- 子选择器(ul < li)
- 后代选择器(li a)
- 伪类选择(a:hover,li:nth-child)
!important的优先级是最高的,但出现冲突时则需比较”四位数“;
优先级相同时,则采用就近原则,选择最后出现的样式;
继承得来的属性,其优先级最低。
提高优先级(偶尔用一下)
css继承
子可以继承父的样式【文本大小、文本颜色、文本风格、字体。。】
子的样式对父不影响
position定位
Static定位、相对定位、绝对定位、固定定位
- 相对定位relative
参照物是自己,原来的位置不会释放出来【不会脱离标准文档流】。使用场景:作为孩子的参照物(根据初始位置做参照)
- 绝对定位absolute
参照物是上一层(即浏览器),原来的位置会释放
该例子(父相子绝),父是div微信,子div3是绝对定位,参照物是微信div