1、radio 和 checkbox 设置默认选中的属性名为checked 值为checked
<input type="radio" name="sex" value="man" checked="checked"> checked 默认选中
2、input控件向后台传递数据，用name属性和value属性来传递
3、浏览器内核
4、选择器
id 选择器
类选择器
.
标签选择器
通配符选择器
比如*
！important>id选择器>class选择器==属性选择器>标签选择器>通配符选择器
属性选择器
【属性名】/[属性名=“值”] {
}
[id="only"]{
background-color: green;
}
.demo{
background-color: black;
}
选择器的权重
！important 无限大
行间样式 1000
id 100
class 伪类 10
标签|伪元素 1
通配符 0
进制是256进制
父子选择器
形式
div span{
background-color: red;
}
选择该父类下的标签添加特定样式
.f em{
background-color: green;
}
这样也可以不一定非的是标签
直接子元素选择器
div > em
表示div下面的直接一级的em
父子选择器多层嵌套的时候 从右边向左边读更好！
<section>
<div>
<p>
<a href="">
<span>
</span>
</a>
</p>
<ul>
<li>
<a href="">
<span>
<em>1</em>
</span>
</a>
<p>
</p>
</li>
<li></li>
</ul>
</div>
<a href="">
<p>
<em>2</em>
</p>
<div></div>
</a>
</section>
section div ul li a {
css…
}
从右往左明显更好
并列选择器
dir.class等等，我觉得他可以通过多重标识比如说标签名和类名或者id来特定的选出特定的标签
权重
<body>
<div class="classDiv" id="idDiv">
<p class="classP" id="idP">1</p>
</div>
css
#idDiv #idP{
background-color: red;
}
#idDiv .classP
{
background-color: green;
}
当有多个选择器选择到用一个元素时，则要根据权重来判断使用哪一个选择器
css代码块格式
属性名 冒号 属性值 ；
单行文本垂直容器的方法
将设置容器的line_heigt 和 heitgt 一样的高度
height: 200px;
line-height: 200px;
px
一个px 只能展示一个颜色点，
分辨率的定义：每英寸屏幕能够放下的屏幕像素点数
em
1em= 1 font-size
伪类选择器
例如a:hover
hover 为鼠标选择的元素 加上装饰
标签类型
行级元素 inline
feature: 内容决定元素所占位置，不可以通过css改变宽高
块级元素 block
span strong em a del
feature:独占一行，可以通过css改变宽高
div p ul li ol form address
行级块元素 inline-block
feature 内容决定大小，可以决定宽高。
改变元素的类型属性名为 display
凡是带有inline的标签，其文字具有特性
例如img 间会带有空白
重点
*在实际操作中很多时候先写css样式，让样式来组合成多种的样式，而不是为单个标签分别定义，以及标签选择器其实最有用的是来自定义标签的初始状态，选择器最有用的是初始化所有标签！！！！
盒子模型
定义
padding
顺时针设置 三个值是上 左右 下
定位
position
absolute
left:距离屏幕左边距离
top:距离屏幕顶端距离
right:同理
buttom:一般不用
**脱离原来位置进行定位，他的定位是相对于最近的有定位的父级元素来进行定位，如果没有相对于文档定位
relative
定位和absolute差不多，但是是保留原来位置进行定位，他的定位是相对于原来的位置进行定位！！！
定位的最佳方式
用relative当作基架让absulute来定位，因为absulute会影响后来的absolute的元素**
margin塌陷
** 垂直方向上的margin 父子共享，可以记为子元素无法改变自身相对于容器的垂直方向上的定位，但可以带动容器在垂直方向上定位，即 父子在垂直方向上的margin 取较大值，需要使用BFC技术来弥补这个问题，注意是弥补不是解决，即修改盒子内的渲染规则**
BFC技术
block format context
如何触发一个盒子的bfc?
一下都可以解决：
position :absolute;
display:inline-block;
float:left;
overflow:hidden;溢出部分隐藏
margin合并问题
问题在于div在各自增加margin时造成了上下的合并，不进行弥补，只让一边添加margin即可。
浮动模型
语法：float:left/right
从左向右 和 从右向左
父级包裹浮动元素的办法：
用p元素设置clear 来撑开父级元素
伪元素
每个标签都存在伪元素
比如span::before{
}
span::after
{
}
重点
解决文字溢出
p{
width: 300px;
height: 20px;
line-height: 20px;
border:1px solid black;
white-space: nowrap;
overflow:hidden;
text-overflow: ellipsis;
}
文字代替图片
将文字的缩进设置成大于容器的内容宽度 然后隐藏