day01
老师所讲内容
CSS语法
css声明
属性名:属性值
css声明块
{
属性名:属性值;
属性名:属性值;
}
css规则
选择器{
属性名:属性值;
属性名:属性值;
}
css样式表
选择器{
属性名:属性值;
属性名:属性值;
}
选择器{
属性名:属性值;
属性名:属性值;
}
选择器{
属性名:属性值;
属性名:属性值;
}
首次开发
css文件外部样式表
二次开发的项目
有1.0版本，不是自己做的，另一个团队做的
2.0版本，添加一些功能，修改一些样式
找别人的样式，找不到，修改一些样式
内部样式表，行内样式表
CSS选择器
基本选择器
*
id选择器
class选择器
标签选择器
层次选择器
空格 后代元素
> 直接子代元素
+ 下一个兄弟元素
~ 之后所有的兄弟元素
属性选择器
[attr] 选择具有attr属性的元素、无论该属性的值是什么
[attr=val] 选择具有attr属性的、并且attr的值为val元素
[attr^=val] 选择具有attr属性的、并且attr的值以val开头的元素
[attr$=val] 选择具有attr属性的、并且attr的值以val结尾的元素
[attr*=val] 选择具有attr属性的、并且attr的值包含val的元素
[attr~=val] 选择具有attr属性的、并且attr的值之一为val的元素
伪类选择器
:only-child 选中独生子元素
:first-child 选中作为别人第一个孩子的元素
:last-child 选中作为别人最后一个孩子的元素
:nth-child(n) 选中作为别人第几个孩子元素的元素
:nth-last-child(n) 选中作为别人倒数第几个孩子的元素
:first-of-type 选中作为别人每种类型中的第一个孩子的元素
:last-of-type 选中作为别人每种类型中的最后一个孩子的元素
:nth-of-type(n) 选中作为别人每种类型中的第几个孩子的元素
:nth-last-of-type(n) 选中作为别人每种类型中的倒数第几个孩子的元素
上面的n可以为元素的序号，也可以为特殊的字符，比如odd，even，n从1开始
:link 未被访问的状态，a标签
:visited 已访问过的状态，a标签
:hover 鼠标悬停的状态，a标签，其他标签也可用
:active 活动的状态， a标签，其他标签也可用
:focus 聚焦的状态
:checked 用户选中的单选按钮和复选按钮
:default 默认选中的单选按钮和复选按钮
:enabled、 :disabled 可用的表单控件、禁用的表单控件
:valid 、:invalid 通过验证的、不通过验证的
:required、:optional 必填的和选填的
:in-range 、:out-of-range 在范围内的、在范围外的
注
1ctrl+b 打开或者关闭左侧栏
