CSS入门基础
CSS基础知识总结
CSS:Cascading Style sheets,级联/层叠样式表
-
用于定义如何显示HTML元素
-
通常保存在外部.css文件中,编辑此文件就能改变页面整体外观
一、CSS基本语法
CSS语句主要由两个部分构成:选择器以及一条或多条声明
h1//选择器{color:blue;font-size:12px;}//s声明
-
选择器:用于指定要改变的html元素
-
声明由属性和值组成
-
每个声明都以;结束并且声明整体由{}包裹
-
在HTML文档中,样式可定义在<style>标签中
对于分离的css文件,通过head标签中引入link实现:
<link rel="stylesheet" type=""text/css href="资源路径"/>
二、CSS选择器
<body>
<p id=p1 class="aa xixi">哈</p>
<p id=p2 target="bb">哈哈</p>
<p id=p3>哈哈哈</p>
<body>
-
标签选择器:p{color:red;} //选择多个标签时中间用
,
隔开 -
id选择器:#p1{color:red;} //id不可以数字开头且不能包含下划线以外符号
-
类选择器:.aa{color:red;} //只要类名中包含选择器中的字符即为选中
-
属性选择器:[target]{color:red;} //包含target属性的标签
-
后代选择器:body p{color:red;} //body的后代p
三、CSS伪类
用于添加一些选择器的特殊效果
语法:selector:pseudo-class {property:value;}
如:p:hover{color:blue}
//当鼠标悬浮在p元素上时元素变为蓝色