css 层叠样式表(一)

来源：互联网发布：网络教育档案拆开编辑：程序博客网时间：2024/05/18 03:40

1.格式:

选择器{属性:值;属性1:值1;}例如：

p{    color:red;    text-align:center;} <body>    <p>         此处为css样式    </p><body>

2. 后缀名

 .css 独立的css(样式)文件

3. 和HTML 整合
方式1:内联样式表通过标签的style属性设置样式
方式2:内部样式表在当前页面中使用的样式.

<head>    <style>        #divId2{            background-color: #0f0;        }    </style></head>

方式3:外部样式表有独立的css文件，通过head标签的link子标签导入。

<link rel="stylesheet" href="css/1.css" type="text/css"/>

4、选择器☆

id 选择器
要求：html元素必须有id属性且有值 <xxx id="id1"></xxx>
css中通过”#”引入,后面加上id的值 #id1{…}
class选择器
要求:
html元素必须有class属性且有值 <xxx class="cls1"/>
css中通过”.”引入,后面加上class的值 .cls1{…}
元素选择器
直接用元素(标签)名即可 xxx{…}
派生的选择器
属性选择器
html元素必须有一个属性不论属性是什么且有值 <xxx nihao="wohenhao"/>
css中通过下面的方式使用：元素名[属性=”属性值”]{….}
例如： xxx[nihao=”wohenhao”]{….}

选择器使用小结:

id选择器:一个元素(标签) class选择器:一类元素 元素选择器:一种元素属性选择器:元素选择器的特殊用法使用的时候注意:(了解)    若多个样式作用于一个元素的时候        不同的样式,会叠加        相同的样式,最近原则    若多个选择器作用于一个元素的时候        越特殊优先级越高 id优先级最高

常用属性
字体

font-family:设置字体(隶书) 设置字体家族font-size:设置字体大小font-style:设置字体风格

文本

color:文本颜色line-height:设置行高text-decoration: 向文本添加修饰。 none underlinetext-align:对齐文本

列表:

list-style-type:设置列表项的类型 例如:a 1  实心圆 list-style-image:设置图片最为列表项类型 使用的时候使用 url函数   url("/i/arrow.gif");

背景:

background-color:设置背景颜色background-image:设置图片作为背景 url尺寸:    width:    height:浮动:    float: 可选值 left right

分类:

clear:设置元素的两边是否有其他的浮动元素    值为:both 两边都不允许有浮动元素display:设置是否及如何显示元素。    none 此元素不会被显示。     block 此元素将显示为块级元素，此元素前后会带有换行符。     inline 默认。此元素会被显示为内联元素，元素前后没有换行符。

阅读全文

0 0