脚本宝典收集整理的这篇文章主要介绍了css选择器和常见样式，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。
作用范围越小越显示
css中/**/表示注释
声明css代码域：一般使用style（在head中）
使用选择器选择要添加样式的标签
根据需求来选择
a.使用*选择器给页面添加基础样式
b.使用类选择器给不同的标签添加基础样式
c.使用标签选择器给某类标签添加基础样式
d.使用id，属性选择器，style属性声明方式给某个标签添加个性化样式
都在style标签中写
标签名{样式名1: 样式值1;...} 作用：会将当前网页内的所有该标签增加相同的样式
table{
width:300px;
height:200px;
border:solid 1px;
background-color:red;
}
#标签的id属性值{样式名1: 样式值1;...} 给某个指定的标签添加 t1表示第一个表格，要先在table中定义
#t1{
background-color:gray;
}
.类选择器名{样式名1: 样式值1;...} 作用：给不同的标签添加相同的样式
.common{
color:yellow;
}
*{样式名1: 样式值1;...} 作用：选择所有html标签并添加相同的样式
选择器1,选择器2,......{样式名1: 样式值1;...} 作用：解决不同的选择器之间重复样式的问题
.common,table{
background-color:blue;
}
选择器1 子标签选择器{样式名1: 样式值1;...} 将所有ul中的li中的a变为黑色 要想将一个变为其他的，就用id标签
ul li a{
color:black;
}
标签名[属性名=属性值]{样式名1: 样式值1;...} 作用：选择某标签指定具备某属性并且属性值为某属性值的标签
input[type=text]{
background-color:red;
}
eg
<html>
<head>
<title>css的选择器学习</title>
<meta charset="UTF-8"/>
<style type="text/css">
table{
width:300px;
height:200px;
border:solid 1px;
background-color:red;
}
#t1{
background-color:gray;
}
.common{
color:yellow;
}
.common,table{
background-color:blue;
}
ul li a{
color:black;
}
input[type=text]{
background-color:red;
}
</style>
</head>
<body>
<h3>css的选择器学习</h3>
<hr />
<hr />
<table id="t1">
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>
<table>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>
<b>css学习</b>
<hr />
<ul>
<li><a href="">哈哈</a></li>
<li><a href="">呵呵</a></li>
<li><a href="">哦哦</a></li>
</ul>
<a href="">嘻嘻</a>
<hr />
<input type="text" />
<input type="password" />
</body>
</html>
边框 border:solid 1px; 表示实线
字体
font-size:10px; 设置字体颜色
font-family:"黑体"; 设置字体格式
font-weight:bold; 设置字体加粗
color:颜色 设置字体颜色
背景图片
background-img:url(图片的相对路径);
background-repeate:no-repeate; 设置图片不重复
background-size:cover; 图片平铺整个页面
背景颜色 background-color:颜色;
高宽
浮动 float:left/right;
行高 line-height:10;
以上是脚本宝典为你收集整理的css选择器和常见样式全部内容，希望文章能够帮你解决css选择器和常见样式所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。