- 第1节:CSS 简介
- 第2节:CSS 语法
- 第3节:CSS Id 和 Class选择器
- 第4节:CSS 创建
- 第5节:CSS Backgrounds (背景)
- 第6节:CSS Text(文本)
- 第7节:CSS Fonts (字体)
- 第8节:CSS 链接样式
- 第9节:CSS 列表样式 (ul)
- 第10节:CSS Table (表格)
- 第11节:CSS Box Model (盒子模型)
- 第12节:CSS Border (边框)
- 第13节:CSS 轮廓(outline)属性
- 第14节:CSS Margin(外边距)
- 第15节:CSS Padding(填充)
- 第16节:CSS 分组和嵌套
- 第17节:CSS 尺寸 (Dimension)
- 第18节:CSS Display (显示) 与 Visibility(可见性)
- 第19节:CSS Positioning (定位)
- 第20节:CSS Float(浮动)
- 第21节:CSS 水平对齐 (Horizontal Align)
- 第22节:CSS 组合选择符
- 第23节:CSS 伪类
- 第24节:CSS 伪元素
- 第25节:CSS 导航栏
- 第26节:CSS 下拉菜单
- 第27节:CSS 图像透明/不透明
- 第28节:CSS 图像拼合技术
- 第29节:CSS 媒体类型
- 第30节:CSS 属性选择器
CSS 语法
CSS 语法
实例
- 查看 实例 1
- 查看 实例 2
CSS 实例
CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明:
选择器通常是您需要改变样式的 HTML 元素。
每条声明由一个属性和一个值组成。
属性(property)是您希望设置的样式属性(style attribute)。每个属性有一个值。属性和值被冒号分开。
CSS 实例
CSS 声明总是以分号 ( ;
) 结束,声明组以大括号 ({ }
) 括起来:
p {color:red;text-align:center;}
为了让 CSS 可读性更强,你可以每行只描述一个属性:
实例
{color:red;
text-align:center;}
CSS 颜色值的写法
在描述颜色的时候,除了使用英文单词 red,我们还可以使用十六进制的颜色值 #ff0000:
为了节约字节,我们可以使用 CSS 的缩写形式:
我们还可以通过两种方法使用 RGB 值:
p { color: rgb(255,0,0); } p { color: rgb(100%,0%,0%); }
提示:当使用 RGB 百分比时,即使当值为 0 时也要写百分比符号。但是在其他的情况下就不需要这么做了。比如说,当尺寸为 0 像素时,0 之后不需要使用 px 单位。
在本站的编程实战部分中,介绍了CSS使用十六进制代码设置颜色,以及CSS使用rgb属性设置颜色,你可以参考该部分的内容进行更多了解。
CSS 注释
注释是用来解释你的代码,并且可以随意编辑它,浏览器会忽略它。
CSS注释以 "/*
" 开始, 以 "*/
" 结束, 实例如下:
/*这是个注释*/
p
{
text-align:center;
/*这是另一个注释*/
color:black;
font-family:arial;
}