css的使用方式()
1.行内样式(内联样式)
<标签 ></标签>
2.页面嵌入(内部样式表)
在head标签里面增加一个子标签
<style>
选择器{
属性名1:属性值1;
属性名2:属性值2;
......
}
</style>
3.外部文件(外部样式表)
在head标签里面增加一个子标签
<link rel="stylesheet" href="css文件的路径" />
4.外部导入样式
主要用在样式初始化。因为有一些标签有自己的样式,我们需要清空,方便自己计算
*{
margin: 0;
padding: 0;
}
css------选择器
ID选择器
使用id选择器:在元素上面增加一个id属性,id属性的属性值不用用数字开头
一个页面中只能有一个id属性值
css中id选择的表示方法用 # 表示
class选择器
使用class选择器:在元素上增加一个class属性,class属性的属性值不能用数字开头
一个页面中可以有多个class属性值
css中class选择器的表示方法用 . 表示
标签选择器
直接写标签名
组合选择器
选择器直接用,分隔开即可
子代选择器
> 只针对子代
后代选择器
用空格表示,包含着子代选择器
通用选择器
* 针对于所有的标签
选择器是有权重的
内联样式 1000
id 100
class 10
元素 1
通用 0
boss !important 只要出现,就以这个为主
text-align: right; /*文本对齐方式*/
text-decoration: underline; /*文本下划线*/
line-height: 166.67px; /*文本的行高*//*一行文字所占的高度,让他上下居中*/
font-family: "字体";设置字体的样式
font-style: ; /*规定字体是否倾斜*/
font-weight: bold;加粗
font-size: 16px ; /*设置字体的大小*/
在浏览器中,默认的字体大小16px
谷歌浏览器中,字体大小最小可以为12px
火狐没有限制
:hover 叫伪类选择器
当你的鼠标放上去的时候,会变化成的样子权值 10
无序列表:
<ul type="">
<li>英语</li>
<li>语文</li>
<li>数学</li>
<li>政治</li>
<li>地理</li>
</ul>
background-color: rgba(255,0,0,0.1); /*最后一个参数a表示透明度,取值的范围是0-1之间,可以为0和1*/
/*只表示背景颜色*/
background-color: #f00;
opacity: 0.1; /*取值的范围是0-1之间,可以为0和1*/
/*表示整个元素*/
原文地址:https://www.cnblogs.com/awei313558147/p/10946530.html