作者:一种姿态获得无可取代 | 来源:互联网 | 2023-06-12 17:43
CSS的选择器(3种):1:id选择器:在标签中添加id属性 (id值不能重复) <标签名><标签名>语法: #id值{ 样式1:样式值1; 样式2:样式值2;
CSS的选择器(3种):
1:id选择器:在标签中添加id属性 (id值不能重复)
<标签名 >标签名>
语法: #id值{
样式1:样式值1;
样式2:样式值2;
}
2:class选择器:在标签中添加class属性
<标签名 class="class值">标签名>
语法: .class值{
样式1:样式值1;
样式2:样式值2;
}
3:元素选择符(类型选择符,标签选择器)
语法:标签名{
样式1:样式值1
样式2:样式值2
}
选择器关系:
1.并列关系:
选择器1,选择器2
{
样式1:样式值1
样式2:样式值2
}
2.父子关系: 选择器1 选择器2
{
样式1:样式值1
样式2:样式值2
}
3.兄弟关系: 选择器1+选择器2
{
样式1:样式值1
样式2:样式值2
}
字体样式:
![CSS的选择器及字体和文本类 CSS的选择器及字体和文本类](https://img1.php1.cn/3cdc5/324f/696/acb375cd938767d1.png)
文本样式:
![CSS的选择器及字体和文本类 CSS的选择器及字体和文本类](https://img1.php1.cn/3cdc5/324f/696/54eff0ef5d1fb74f.png)
边框样式:
![CSS的选择器及字体和文本类 CSS的选择器及字体和文本类](https://img1.php1.cn/3cdc5/324f/696/605541ca2f3f05d8.png)
在border-style:
![CSS的选择器及字体和文本类 CSS的选择器及字体和文本类](https://img1.php1.cn/3cdc5/324f/696/166248763ad8b27d.png)
![CSS的选择器及字体和文本类 CSS的选择器及字体和文本类](https://img1.php1.cn/3cdc5/324f/696/69a84a42f205fc1f.png)
![CSS的选择器及字体和文本类 CSS的选择器及字体和文本类](https://img1.php1.cn/3cdc5/324f/696/edafc0eb0614e632.png)
属性用来定义边框的颜色
简易写法:
border-width: 1px;
border-style: solid;
border-color: red;
可以简写为:border:1px solid red;
局部边框样式
border-top:上;
border-bottom:下;
border-left:左;
border-right:右;