css
概念:
表现HTML或XHTML文件样式的计算机语言
包括对字体、颜色、边距、高度、宽度、背景图片、网页定位等设定
CSS的优势
内容与表现分离 网页的表现统一，容易修改 丰富的样式，使得页面布局更加灵活 减少网页的代码量，增加网页的浏览速度，节省网络带宽 运用独立于页面的CSS，有利于网页被搜索引擎收录
CSS基本语法结构
选择器{
声明1;
声明2；
}style标签
<style type="text/css">
h1 {
font-size:12px;
color:#F00;
}
</style>HTML中引入CSS样式
行内样式 使用style属性引入CSS样式
示例：
<h1 style="color:red;">style属性的应用</h1> <p style="font-size:14px; color:green;">直接在HTML标签中设置的样式</p>
内部样式表 CSS代码写在<head>的<style>标签中
<style>
h1{color: green; }
</style>
/*优点
方便在同页面中修改样式
缺点
不利于在多页面间共享复用代码及维护，对内容与样式的分离也不够彻底
*/外部样式表
CSS代码保存在扩展名为.css的样式表中 HTML文件引用扩展名为.css的样式表，有两种方式
链接式 导入式
链接外部样式表
<head> …… <link href="style.css" rel="stylesheet" type="text/css" /> …… </head>
外部样式表 导入外部样式表
<head>
……
<style type="text/css">
<!--
@import url("style.css");
-->
</style>
</head>链接式与导入式的区别
<link/>标签属于XHTML，@import是属于CSS2.1 使用<link/>链接的CSS文件先加载到网页当中，再进行编译显示 使用@import导入的CSS文件，客户端显示HTML结构，再把CSS文件加载到网页当中 @import是属于CSS2.1特有的，对不兼容CSS2.1的浏览器是无效的
CSS样式优先级:
行内样式>内部样式表>外部样式表
CSS3基本选择器:
标签选择器 类选择器 ID选择器
示例：
p { font-size:16px;}//标签
.class { font-size:16px;}//类
#id { font-size:16px;}//Id
/*
标签选择器直接应用于HTML标签
类选择器可在页面中多次使用
ID选择器在同一个页面中只能使用一次
*/优先级：ID选择器>类选择器>标签选择器
CSS的高级选择器：
层次选择器 结构伪类选择器 属性选择器
层次选择器
结构伪类选择器
属性选择器
相关推荐
jiedinghui 2020-10-25
葉無聞 2020-09-01
buttonChan 2020-08-02
nicepainkiller 2020-07-24
CSSEIKOCS 2020-07-18
Ladyseven 2020-10-22
zuncle 2020-09-28
xiaohuli 2020-09-02
nicepainkiller 2020-08-20
AlisaClass 2020-08-09
myloveqiqi 2020-08-09
drdrsky 2020-07-29
Ladyseven 2020-07-25
AlisaClass 2020-07-19
hellowzm 2020-07-19
background-color: blue;background-color: yellow;<input type="button" value="变蓝" @click="changeColorT
昔人已老 2020-07-19
骆驼的自白 2020-07-18
lanzhusiyu 2020-07-19
hellowzm 2020-07-19