样式的引入方法
内部样式
点击查看代码
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style type="text/css">
body {
background-color: #000;
}
</style>
</head>
行内样式
<span style="color: red;">红色字体</span>
外部样式 link引入和@import引入
注意@import引入必须放在 style的前面
<link href="a.css" rel="stylesheet" type="text/css"/>
点击查看代码
<style type="text/css">
@import url("a.css");
body {
background-color: #fff;
}
</style>
CSS特性 继承性
继承性是指后代元素继承祖先元素的样式,继承样式主要包括字体、文本等基本属性。如:字体、字号、颜色、行距等。不允许继承的属性有边框、边界、补白、背景、定位、布局、尺寸等。
CSS特性 层叠性
层叠性是指对同一个对象应用多个样式的能力 不同选择器的权重不一样,注意区分 important表示权重最高 无限高
font-size: 12px!important;
CSS选择器
元素选择器(标签选择器、类选择器、ID选择器、通配选择器)
标签选择器:直接选择所有html标签,如body、p、a等
body{ font-size: 12px!important; }
类选择器
以(.)为前缀,后面是一个类名,可直接在 网页上使用
.red{color: red;}
<span class="red">红色字体</span>