CSS学习笔记整理

时间：2015-02-17 14:05:20 阅读：247 评论：0 收藏：0 [点我收藏+]

标签：

div+css布局：div是用于存放内容（文字，图片，元素）的容器

css是用于指定放在div中的内容的位置和外观。

使html文件内容减少，html变得简单；内容和样式分离

css可以统一网站风格

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

DOCTYPE：文档类型，用于指定DTD（说明当前这个html文件的版本）

< 元素名 background-color: rgb(255, 255, 255); color: rgb(0, 0, 0); font-family: 微软雅黑; font-size: 14px; font-style: normal; font-weight: normal; line-height: 1.5;">属性名：属性值；"/>
<style type="text/css">

这里是内容

</style>

字体：font-size字体大小；font-weight字体粗细；font-style字体风格倾斜；color字体颜色
text-decoration:underline;none;

滤镜技术filter：

<style type="text/css">

img{

filter：gray；

}

</style>

鼠标悬停变回原来颜色

<style type="text/css">

a:link img{

filter：gray；

}

a:hover img{

filter：""；

}

a:visited img{

color：red；

}

</style>

选择器：类选择器、id选择器、html选择器、通配符选择器
类选择器：<link rel="stylesheet" type="text/css" href="#">;用class="类选择器名"使用

.类选择器名{ .style1{

属性名：属性值； font-weight:bold;
... font-size:2px;
} }

id选择器：用id="id选择器名"

#id选择器名{ #style2{

属性名：属性值； font-weight:bold;
... font-size:2px;
} }

html选择器：html文件元素的名称

html元素名称{ body{

属性名：属性值；
... font-size:2px;
} }

当一个元素同时被id选择器、类选择器和html选择器修饰，优先级是

id选择器>类选择器>html选择器

一个元素最多只有一个id选择器，但是可以有多个类选择器。
在引用多个class选择器的时候，class="style1 style2"，以最后出现的类选择器样式为主
通配符选择器：所有元素都符合一种样式

margin:0;padding:0;

}

margin: 10 10 10 10；

如果margin给出四个值,则表示上，右，下，左

父子选择器:子选择器标签是html可以识别的标签；

父子选择可以有多级，适用于id选择器和class选择器

#style2 span span{

color="red";

font-size="20";

}

在有些css中，我们可以多个选择器的共同部分提取出来，写在一起，简化css文件
块元素和行内元素

行内元素又叫内联元素，只能容纳文本或其他内联元素（不同浏览器不同），常见有<span>h和<a>
块元素一般从新行开始，可容纳文本，其他内联元素和其他块元素，即使内容不够一行，也会占满整行。常见有<div>和<p>

块元素和行内元素相互转换:display:inline;转为行内元素

display:block;转为块元素

流：标准流：布局中，元素按顺序排列出现

非标准流：布局中，某个元素脱离了标准流

盒子模型

浮动分为左浮动、右浮动和清除浮动。对块元素和行内元素都生效。向左/右浮动就相当于让出自己的左/右边，别的元素就会在它的左/右边排列。float:left;right;文字环绕图片效果。

默认情况下：

调整后：

定位：用position对元素进行定位。属性值有static(默认值)、relative(相对定位)、absolute(绝对定位)、fixed(元素框的表现类似于position设为absolute，不过其包含的块是视窗本身).
格式：position:属性值

relative:元素框偏移某个距离（left和top），元素本身不变，原位置所占空间保留。参照点是原来本身的位置

absolute：元素从原来位置脱离,让出原来位置,被后面的元素战占有。参照点是离它最近的那个非标准流而言。

CSS学习笔记整理

标签：

原文地址：http://www.cnblogs.com/hyclearning/p/4295183.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行