css字体样式属性 **font-size:字号大小
**font-family:字体
*可以设置多个字体,按顺序查找使用
*字体可以用unicode表示,兼容性更好
**font-weight:字体粗细
bold/700 :加粗
normal/400 :不加粗
**font-style:字体风格
normal: 正常字体
italic: 倾斜字体
**font:综合设置字体样式
选择器 {font: font-style font-weight font-size font-family}
font-style font-weight 可以省略
css类选择器 class="orange" .orange { color="orange"} .是class #是id 是所有选择器 html页面内可以写多个class,中间用空格封开 后代选择器 (所有下层内的标签) body p{} 子代选择器 (仅下一层标签) body>p{} 兄弟选择器 (同级标签) head+body{}
伪类选择器
:link 未访问的链接
:visited 已访问的链接
:hover 悬停的链接
:active 点击不松开
以上4个伪类顺序不能颠倒
伪元素选择器
:nth-of-type(n)选择器匹配同类型中的第n个同级兄弟元素。
:nth-child(n)选择器匹配父元素中的第n个子元素。
:first-child 第一个元素
:last-child 最后一个元素
:nth-child(n) 第n个元素(从头开始)
:nth-last-child(n) 第n个元素(从最后开始)
参考资料:
https://www.w3cschool.cn/cssref/sel-nth-of-type.html
目标伪类选择器
:target 当前激活的标签样式,有且仅有一个激活标签
css颜色 1. color:red 2. color:#ff1133 16进制 3. color:rgb(255,0,0)
css文本样式 line-height 行间距 text-align 水平对齐方式 text-indent 首行缩进 letter-spacing 字间距 word-spacing 单词间距,仅对英语有效
css透明度 16进制的颜色最后添加2位透明度的值,最后两位透明度的取值范围[0~ff] body{ background-color: #ff000080; } rgba表示方式 a的取值范围[0~1] body{ background-color:rgba(255,0,0,0.5) }
透明背景:
opacity // 取值范围0~1
css文字阴影
text-shadow:{ 5px , 4px, 4px, rgba(0,0,0,0.5)}
水平阴影 垂直阴影 模糊距离 阴影颜色
前两个参数必须写,后两个参数可以省略
快速写标签
a*5+table 5个a标签
.red+table class="red"的div标签
#red+table id="red"的div标签
div+p+table div和p兄弟标签
div>p div的子标签p
css样式类型
内联样式
写在