一、关于 CSS 的简介
二、HTML 中引入 CSS
<table style="font-size:12px">
<style type="text/css"></style>
<link rel="stylesheet"type="text/css"href="" />
- 导入样式
在 CSS 中引入其他 css@import url("/css/global.css"); (不常用)
三、CSS 选择器
table{
color:red;
}
- 类选择器 ' . +类名'
.kk{
color: red;
}
- ID选择器 `# +名字`
#kk{
color:red;
}
- 后代继承选择器
.outer table {
color: green;
}
- 群选择器
.outer table, .pp{
color: green;
}
- 属性选择器
input[type=text]{
color: yellow;
}
三、选择器优先级
important>内联>id>class>标签|伪类|属性选择>伪对象>继承>通配符>
- important:
#tableid {
color: orange!important;
}
- 内联:
<table style="color :red;">
- id:
#tableid {
color: orange!important;
}
<table id="tableid">
- class
.test {
color: black;
}
<table class="test" >
- 伪类:
/*伪类*/
a:link{color: #FF0000;}*//*未访问的链接
a:visited{color: #FF0000;}/*已访问的链接*/
a:hover{color: #FF0000;}/*鼠标滑过的链接*/
a:active{color: #FF0000;}/*以选中的链接*/
:first-of-type /*从第一组中选择第一个元素*/
:last-of-type /*从第一组中选择最后一个元素*/
:selection /*选中文本后的效果*/
a::before{
content: '\f04';
color: red;
}
a::after{
content: 'hello';
color: green;
}