CSS基础（一）
本文参考了http://www.w3school.com.cn/css/
什么是CSS
- 层叠样式表 (Cascading Style Sheets)
- 可以独立与html文档，存在于.css文件中
- 可被应用到多个html文档中
- 可以使html文档专注的表示文档内容而不需要考虑样式
优先级
- 最高：内联样式，在标签内部声明
- 其次：内部样式，在head标签声明
- 再次：外部样式，在.css文件中声明
- 最后：浏览器的缺省设置
基本语法
selector{
property1: value1;
property2: value2;
}- selector可以多个同时赋值，用逗号隔开
- 属性后面一定要加冒号，习惯性加一个空格
- 值的后面加分号，如果是两个单词或以上要加引号
关于继承
- 不是每个浏览器都支持继承，一般来说规定了父标签之后，紧接着规定字标签的属性
派生选择器（上下文选择器）
- 规定某一标签在另一标签内部时的样式
- selector2在selector1内部时属性满足如下条件
selector1 selector2{
property1: value1;
property2: value2;
}id选择器
- 在标签中标记id，id在css文件中
- css文件
#idname{
property1: value1;
property2: value2;
}- html文件
<html>
<head>
<tittle>timu</tittle>
</head>
<body id="idname">
</body>
</html>类选择器
- 在标签中标记class，class在css文件中
- css文件
。classname{
property1: value1;
property2: value2;
}- html文件
<html>
<head>
<tittle>timu</tittle>
</head>
<body class="classname">
</body>
</html>- 也可以规定类内的标签样式
.classname p{
property1: value1;
property2: value2;
}- 也可以规定标签内部的类
p.classname{
property1: value1;
property2: value2;
}属性选择器
- 在标签中标记属性，属性在css文件中
- css文件
[tittle]{
property1: value1;
property2: value2;
}- html文件
<html>
<head>
<tittle>timu</tittle>
</head>
<body tittle="prop_name">
</body>
</html>- 上面规定所有标签内部有 tittle=”“的都满足上述属性
- 在css文件中也可以这样定义
- css文件
[tittle="big"]{
property1: value1;
property2: value2;
}上面规定所有标签内部有 tittle=”big”的都满足上述属性
- 我觉得属性选择器相当于自己定义了一个类之类的东西
- 在input这样的不能用类的标签中就需要属性选择器了
扫一扫
411
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
