A 文字

1 font-family:字体名称

注意: 当指定多种字体时,用“,”分隔每种字体的名称
当字体名称包含两个以上分开的单词是,用“”把该字体名称括起来。
当样式规则外已经有“”时,用‘’代替“”。

2 font-size:字号参数。

3 font-style:斜体字的名称。

normal正常状态、italic斜体字、oblique 斜体和正常状态之间。

4 font-weight:字体粗细。

取值是:number(100~900) 或者参数 lighter(细体) 和bold(粗体)bolder(特粗体) 参数 显示更细或更粗。

5 text-transform:参数

参数的范围: uppercase 所有文字大写显示
lowercase:所有文字小写显示
capitalize 每个单词的头字母大写
none 不继承母体的文字变形参数。

6 text-decoration:参数

参数的范围: underline 为文字加下划线
overline 为文字加上划线
line-through 为文字加删除线
blink 使文字闪烁
none 不显示上叙任何效果。

7 color:#rrggbb或者 #rgb原则(还可以参考资料有多种方式,但是只要掌握基本的一种方式)。

8 可以用font 属性全部定位

示例:p{font:italic bold 12pt;}

B 背景

1 background-color 背景颜色

2 background-image 背景图片
示例:{background-image:url('http://baidu.com/zhouliang.gif')}

3 background-repeat:参数
参数的范围:
repeat 表示图像从水平和垂直角度平铺
no-repeat 不重复平铺背景图片
repeat-x 使图片只在水平方向上平铺
repeat-y 使图片只在垂直方向上平铺。

4 background-attachment 参数
fixed 网页滚动时,背景图片相对浏览器而言固定不动。
scroll 网页滚动时,背景图片相对浏览器而言一起滚动。

5 background-postion 参数 (背景定位)
参数:top 相对前景对象顶对齐
bottom 相对前景对象底对齐
left 相对前景对象左对齐
right 相对前景对象右对齐
center 相对前景对象中心对齐
说明:一般用坐标的方式来确定图片的位置。
6 可以直接用 background 复合属性来确定式样
示例:table{background:#001122 url(zhouliang.jpg) no-repeat bottom right}

C 文本

1 英文单词间距 word-spacing:
取值可以是:normal或者是单位像素;

2 英文字母间距 letter-spacing:间隔距离
取值可以是:normal或者是单位像素;

3 行距 line-height:值

可以是精确的值,也可以是百分比。

4 文本水平排列text-aglin:参数

left: 左对齐 right:右对齐 center: 居中 justify:相对左右对齐。
注意到:text-aglin 是块级属性,只能用于<p><blockquqte><ul><h1>-<h6>等表示符里

5 文本垂直排列 vertical-align:参数

top 顶对齐 bottom 底部对齐 text-top 相对文本顶对齐
text-bottom相对文本底对齐 baseline:基准线对齐 middle 中心线对齐
sub 以下标的形式对齐 sup 以上标的形式对齐,相对于元素行高属性的百分比。

6 文本缩进 text-indent 缩进距离

说明:缩进距离必须是值或者%比

7 white-space

设置值:normal:合并连续的多个空格
pre:保留原样式
nowrap:不换行,直到遇到<br>标签

8 text-decoraition

值:none :表示不对文本进行修饰,也是默认值,
underline:表示对文字添加下划线
overline:表示添加上划线
line-through:表示对文本添加删除线
blink:表示文字具有闪烁效果

9:text-transform文本转换

取值范围:none:表示原有值
capitalize:使每个字的第一个字母大写
uppercase:大写
lowercase:小写

D 定位
是指指定元素的位置,他是CSS-P(cascading style sheets positioning)中的内容,CSS-P是CSS的一个扩展,
它可以用来控制任何网页元素在浏览器文档窗口中的位置。

1:postion

设置值: 含义
absolute 采用绝对定位(分别用四个边框来定位)
relative 采用相对定位(也得用四个边框来设定位置)
static 默认值

2:left/top/width/height

说明:设置值可以是

3:z-index(也就是元素的堆叠,大的在上,小的在下。默认是按照先后顺序)

说明:取值auto默认值,表示它遵循其父对象的定位属性;如果设置为数字,必须是无单位的正整数,可以取负值,
但是一般为正数,一般数字为1时间是最底层。

E 布局

1 visibility 可视性

设置值:inherit:表示对象继承父本的继承性。
visible:表示对象可见
hidden:表示对象隐藏

2 display 设置或检索对象是否及如何显示

设置值:block、inline、list-item、none

3 clip 可视区域
设置值:auto表示对象不裁剪
rect(数值表示)(一般有四个设置值:方向定位于上右下左的顺序,一般以左上角(0,0)坐标计算4个偏移数值。其中 任何一个值都可以用auto代替)

4 overflow 超出范围:
设置值:isible 扩大浏览器
hidden 裁剪掉多余的文本
scroll 滚动条
auto 当有多余的时候才显示滚动条
5 float 浮动属性

设置值:left表示文字浮在元素左侧
right 表示文字浮在元素右侧
none 默认值,表示不浮动。<该属性特别重要,一定要掌握>

6 clear 表示指定一个元素周围是都允许有其他元素漂浮在它的周围。

设置值:left ,right,none,both;指要清除本元素四周的浮动对象。

7 page-break-before 设置值:always 是否强制分页

8 page-break-after 设置值:always 打印后设置是否强制分页

9 width和height 表示层的宽度与高度。设置值为 auto|数值

F 边距与填充属性

1 复合属性margin:与边距的距离

(margin-top margin-left margin-bottom margin-left)
取值可以是:auto默认
%比或者具体的值:
说明:取值可以是一个或者两个或者三个或者四个(每个都具有不同的含义)。

2 复合属性填充(指用白值填充):padding

说明:和margin的用法一样。

3 border-width

边框宽度:
border-top-width:上边框宽度
border-right-width:右边框宽度
border-bottom-width:底边框宽度
border-left-width:左边框宽度
取值为:medium 默认宽度;thin 细边框 thick 粗边框

4 border-style

border-top-style:上边框样式
border-right-style:右边框样式
border-bottom-style:底边框样式
border-left-style:左边框样式
取值: 含义

none 不现实边框,为默认值
dotted 点线(电线)
dashed 虚线,也称短线
solid 实线
double 双实线
groove 边框带有立体感的沟槽
ridge 边框成脊形
inset 使整个表框凹陷,即在边框内嵌入一个立体边框
outset 使整个边框凸起,即在边框外嵌入一个立体边框

5 border-color

设置边框的颜色:用法同上margin

6: border

复合属性:border:边框宽度|样式|颜色
那么还有:border-top|border—right|border—bottom|border-left

G 列表
1:list-style-type 指显示于列表项前的标识符号

取值: 含义
none 表示不显示列表符号
..... ..........

2:列表缩进 list-style-postion 列表位置描述列表在何处显示

参数:inside 列表内容和列表标识符号处在不同垂直位置,在符号内测。
outside 列表内容和列表标识符号处在同一垂直位置
3: list-style-image
说明:用图片符号作为链接标题
取值 含义
none 表示不指定图像
url(网页地址) 指定图片位置

4:复合属性:list-style

实现以上三种属性

H 光标属性

1 cursor 当点击某个内容时,鼠标显示其他的图形
style="cursor:hand" 手形
style="cursor:crosshair" 十字形
..............

G 滤镜属性
1 filter

CSS样式属性分类的更多相关文章

  1. 【3-24】css样式表分类、选择器、样式属性

    一.css样式表分类: (一)内联样式表:代码写在标签内的样式表  控制精确 代码重用性差  优先级最高 格式:<p style="样式属性">内容</p> ...

  2. 第一章入门篇CSS样式的分类、盒模型

    1.CSS样式的分类 CSS样式分为一项4种: 1.内联样式表,直接写在元素style属性里面的样式,如 <p style="color:red;">内联样式</ ...

  3. js中获取css样式属性值

    关于js中style,currentStyle和getComputedStyle几个注意的地方 (1)用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的.针对css ...

  4. IE6支持兼容min-width、max-width CSS样式属性

    IE6支持兼容min-width.max-width CSS样式属性 让IE6支持max-width.IE6支持min-width样式 我们在写CSS的时候,常常会遇到让一个图片或一个布局不能超出设定 ...

  5. css——样式表分类,选择器

    一,样式表分类 (1)内联样式[优先级最高][常用][代码重复使用性最差] (当特殊的样式需要应用到个别元素时,就可以使用内联样式. 使用内联样式的方法是在相关的标签中使用样式属性.样式属性可以包含任 ...

  6. HTML布局相关的CSS样式属性

    # 转载请留言联系 注意,样式属性是写进CSS里面的. 布局常用样式属性: width 设置元素(标签)的宽度,如:width:100px; height 设置元素(标签)的高度,如:height:2 ...

  7. CSS样式属性单词之Left

    通常left单独在CSS中设置无效,需要在使用position属性下使用才能生效起作用.left左靠多少距离(距离左边多少)的作用. left 一.left认识与语法 left翻译:左边,左 在CSS ...

  8. 常用CSS样式属性

    01.常用样式 1.1.background背景 设置元素背景的样式 background,更好的衬托内容. 属性 描述 值 background 背景属性简写.支持多组背景设置,逗号,隔开 back ...

  9. IE6支持min-width、max-width CSS样式属性

    1.IE6支持max-width解决方法 IE6支持最大宽度,解决CSS代码: .yangshi{ max-width:1000px; _width:expression((document.docu ...

随机推荐

  1. 浅谈HTML中的块级元素和内联元素

    一.基本概念 1.块级元素(block element):一般都从新行开始占据一定的矩形空间,可以设置其宽.高属性来改变矩形的大小.一般情况下块级元素可以包含内联元素和其它块级元素,但也有特殊如for ...

  2. n阶魔方阵(奇数阵)的输出

    需求 要求输出1~n²的自然数构成的魔方阵. STEP 1 什么是魔方阵? 魔方阵,古代又称“纵横图”,是指组成元素为自然数1.2…n2的平方的n×n的方阵,其中每个元素值都不相等,且每行.每列以及主 ...

  3. 自定义控件-滑动条SeekBar

    一.效果图 二.实现思路 1.控件继承自View 2.重写两个方法onDraw() 绘制页面和 onTouch() 添加监听 3.onDraw(Canvas ca)中     a.new Canvas ...

  4. c# IE 清除缓存

    Response.Buffer = true; Response.ExpiresAbsolute = System.DateTime.Now.AddSeconds(-); Response.Expir ...

  5. Python 使用 os.fork() 创建子进程

    Linux 操作系统提供了一个 fork() 函数用来创建子进程,这个函数很特殊,调用一次,返回两次,因为操作系统是将当前的进程(父进程)复制了一份(子进程),然后分别在父进程和子进程内返回.子进程永 ...

  6. 怎么样编译DeepMind?

    可以通过下面的文章来编译著名的deepmind系统. How to build DeepMind LabDeepMind Lab uses Bazel as its build system. Its ...

  7. 随手一写就是一个侧滑关闭activity

    刚忙完一段时间,今天刚清闲会,就把以前写的东西整理整理.于是冥冥中发现有些东西完全可以共享出来,毕竟那么常见,而且简单实用. 实现原因 其实侧滑关闭activity在网上也有大量的文章去介绍他,我也有 ...

  8. linux系统编程-进程

    进程 现实生活中 在很多的场景中的事情都是同时进行的,比如开车的时候 手和脚共同来驾驶汽车,再比如唱歌跳舞也是同时进行的: 如下是一段视频,迈克杰克逊的一段视频: http://v.youku.com ...

  9. C++语言的url encode 和decode

    std::string UrlEncode(const std::string& szToEncode) { std::string src = szToEncode; char hex[] ...

  10. OK335xS 系统启动配置解析

    OK335xS 系统启动配置解析 一.参考文档: AM335x ARM® Cortex™-A8 Microprocessors (MPUs) Technical Reference Manual 二. ...