云顶娱乐官方入口-www.40081.com-云顶娱乐网址4118112
做最好的网站
您的位置:云顶娱乐官方入口 > 云顶娱乐网址4118112 > 简写方法 {background,用任何不带格式的文本编辑

简写方法 {background,用任何不带格式的文本编辑

2019-10-07 21:13

  绝对定位:允许元素与原始的文档布局分离并且任意定位。 

Ø 分类列表 

序号 中文说明 标记语法 

1 控制显示 {display:none|block|inline|list-item} 

2 控制空白 {white-space:normal|pre|nowarp} 

3. 符号列表{list-style-type:disc|circle|square|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha|none}

4 图形列表 {list-style-image:URL} 

5 位置列表 {list-style-position:inside|outside} 

6 目录列表 {list-style:目录样式类型|目录样式位置|url} 

7 鼠标形状 {cursor:hand|crosshair|text|wait|move|help|e-resize|nw-resize|w-resize|s-resize|se-resize|sw-resize}

1、alpha 语法:filter:alpha(Opacity=,FinishOpacity=,Style=,StartX=,StartY=,Finishx=,FinishY=)作用是把一个元素与背景混合。

Ø [背景]属性共有六项: 

 

「背景颜色」(background-color),设置背景颜色。 

「背景图像」(background-image),设置网页背景图像。 

「重复」(background-repeat),控制背景图像的平铺方式,有不重复(no-repeat)、重复(repeat,沿水平、垂直方向平铺)、横向重复(repeat-X,图像沿水平方向平铺)和纵向重复(repeat-Y,沿图像垂直方向平铺)等4种选择。 

「附加」(background-attachment),用于控制背景图像是否会随页面的滚动而一起滚动。有固定(fixd,文字滚动时,背景图像保质固定)和滚动(scroll,背景图像随文字内容一起滚动)两种选择。 

「水平位置」/「垂直位置」(background-position),确定背景图像的水平、垂直位置 

。共有左对齐(left)、右对齐(right)、顶部(top)、底部(bottom)、居中(center)和值(自定义背景图像的起点位置,可使用户对背景图像的位置做出更精确的控制)等6种选择。 

 

三、URL单位

一、各个区块的属性

  CSS的格式化定义包括两种元素:块级元素和行内元素。 

Ø CSS边框空白

padding-top:10px; /*上边框留空白*/ 

padding-right:10px; /*右边框留空白*/ 

padding-bottom:10px; /*下边框留空白*/ 

padding-left:10px; /*左边框留空白

5、font-size:absolute-size|relative-size|length|percentage 

Ø CSS连接属性:

a /*所有超链接*/ 

a:link /*超链接文字格式*/ 

a:visited /*浏览过的链接文字格式*/ 

a:active /*按下链接的格式*/ 

a:hover /*鼠标转到链接*/ 

鼠标光标样式:

链接手指 CURSOR: hand 

十字体 cursor:crosshair 

箭头朝下 cursor:s-resize 

十字箭头 cursor:move 

箭头朝右 cursor:move 

加一问号 cursor:help 

箭头朝左 cursor:w-resize 

箭头朝上 cursor:n-resize 

箭头朝右上 cursor:ne-resize 

箭头朝左上 cursor:nw-resize 

文字I型 cursor:text 

箭头斜右下 cursor:se-resize 

箭头斜左下 cursor:sw-resize 

漏斗 cursor:wait 

光标图案(IE6)   p {cursor:url("光标文件名.cur"),text;} 

1、margin-top:length|percentage|auto 

 1.部分英文

头:header 

  内容:content/containe 

  尾:footer 

  导航:nav 

  侧栏:sidebar 

  栏目:column 

  页面外围控制整体布局宽度:wrapper 

  左右中:left right center 

  登录条:loginbar 

  标志:logo 

  广告:banner 

  页面主体:main 

  热点:hot 

  新闻:news 

  下载:download 

  子导航:subnav 

  菜单:menu 

  子菜单:submenu 

  搜索:search 

  友情链接:friendlink 

  页脚:footer 

  版权:copyright 

  滚动:scroll 

  内容:content 

  标签页:tab 

  文章列表:list 

  提示信息:msg 

  小技巧:tips 

  栏目标题:title 

  加入:joinus 

  指南:guild 

  服务:service 

  注册:regsiter 

  状态:status 

  投票:vote 

  合作伙伴:partner 

 

 

XHTML文件中id的命名 

(1)页面结构 

  容器: container 

  页头:header 

  内容:content/container 

  页面主体:main 

  页尾:footer 

  导航:nav 

  侧栏:sidebar 

  栏目:column 

  页面外围控制整体布局宽度:wrapper 

  左右中:left right center 

(2)导航 

  导航:nav 

  主导航:mainbav 

  子导航:subnav 

  顶导航:topnav 

  边导航:sidebar 

  左导航:leftsidebar 

  右导航:rightsidebar 

  菜单:menu 

  子菜单:submenu 

  标题: title 

  摘要: summary 

(3)功能 

  标志:logo 

  广告:banner 

  登陆:login 

  登录条:loginbar 

  注册:regsiter 

  搜索:search 

  功能区:shop 

  标题:title 

  加入:joinus 

  状态:status 

  按钮:btn 

  滚动:scroll 

  标签页:tab 

  文章列表:list 

  提示信息:msg 

  当前的: current 

  小技巧:tips 

  图标: icon 

  注释:note 

  指南:guild 

  服务:service 

  热点:hot 

  新闻:news 

  下载:download 

  投票:vote 

  合作伙伴:partner 

  友情链接:link 

  版权:copyright 

22、border:border-width|border-style|color 

Ø 2. 选择符组 

你可以把相同属性和值的选择符组合起来书写,用逗号将选择符分开,这样可以减少样式重复定义: 

 

h1, h2, h3, h4, h5, h6 { color: green } 

 

(这个组里包括所有的标题元素,每个标题元素的文字都为绿色) 

 

p, table{ font-size: 9pt } 

 

(段落和表格里的文字尺寸为9号字) 

 

效果完全等效于: 

 

p { font-size: 9pt } 

table { font-size: 9pt } 

 

一、滤镜属性

Ø [列表]属性共有3项: 

「类型」(list-style-type),确定列表每一项前使用的符号,共有圆点(disc)、圆圈(circle)、方形(square)、数字(decimal)、小写罗马数字(lower-roman )、大写罗马数字(upper-roman)、小写字母(lower-alpha)和大写字母(upper-alpha)等8种。 

「项目图像」(list-style-image),其作用是将列表前面的符号换为图形。 

「位置」(list-style-position),用于描述列表位置,有内(outside)和外(inside)两种选择。 

6、z-index:auto|integer

Ø CSS文字属性:

color : #999999; /*文字颜色*/

font-family : 宋体,sans-serif; /*文字字体*/ 

font-size : 9pt; /*文字大小*/ 

font-style:itelic; /*文字斜体*/ 

font-variant:small-caps; /*小字体*/ 

letter-spacing : 1pt; /*字间距离*/ 

line-height : 200%; /*设置行高*/ 

font-weight:bold; /*文字粗体*/ 

vertical-align:sub; /*下标字*/ 

vertical-align:super; /*上标字*/ 

text-decoration:line-through; /*加删除线*/ 

text-decoration: overline; /*加顶线*/ 

text-decoration:underline; /*加下划线*/ 

text-decoration:none; /*删除链接下划线*/ 

text-transform : capitalize; /*首字大写*/ 

text-transform : uppercase; /*英文大写*/ 

text-transform : lowercase; /*英文小写*/ 

text-align:right; /*文字右对齐*/ 

text-align:left; /*文字左对齐*/ 

text-align:center; /*文字居中对齐*/ 

text-align:justify; /*文字分散对齐*/ 

vertical-align属性

vertical-align:top; /*垂直向上对齐*/ 

vertical-align:bottom; /*垂直向下对齐*/ 

vertical-align:middle; /*垂直居中对齐*/ 

vertical-align:text-top; /*文字垂直向上对齐*/ 

vertical-align:text-bottom; /*文字垂直向下对齐*/ 

3、首行和首字伪元素: 

Ø4. 内嵌样式 

 

内嵌样式是混合在HTML标记里使用的,用这种方法,可以很简单的对某个元素单独定义样式。内嵌样式的使用是直接将在HTML标记里加入style参数。而style参数的内容就是CSS的属性和值,如下例: 

 

<p style="color: sienna;margin-left: 20px;"> 

这是一个段落 

</p> 

<!--这个段落颜色为土黄,左边距为20象素--> 

 

在style参数后面的引号里的内容相当于在样式表大括号里的内容。 

注意:style参数可以应用于任意BODY内的元素(包括BODY本身),除了BASEFONT、PARAM和SCRIPT。 

 

absolute-size:xx-small|x-small|small|medium|large|x-large|xx-large 
relative-size:larger|smaller 

Ø 定位属性: (Position)

Position: absolute; relative; static;

visibility: inherit; visible; hidden;

overflow: visible; hidden; scroll; auto;

clip: rect(12px,auto,12px,auto) (裁切)

 

 

 

 

 

 

 

 

1、font-family:如果字体的名称中含有空格,那么要加上双引号。 

七、附录

3、font-variant:normal|small-caps 

Ø 1. 链入外部样式表 

 

链入外部样式表是把样式表保存为一个样式表文件,然后在页面中用<link>标记链接到这个样式表文件,这个<link>标记必须放到页面的<head>区内,如下: 

 

<head> 

…… 

<link href="mystyle.css" rel="stylesheet" type="text/css" media="all"> 

…… 

</head> 

 

上面这个例子表示浏览器从mystyle.css文件中以文档格式读出定义的样式表。rel=”stylesheet”是指在页面中使用这个外部的样式表。type=”text/css”是指文件的类型是样式表文本。href=”mystyle.css”是文件所在的位置。media是选择媒体类型,这些媒体包括:屏幕,纸张,语音合成设备,盲文阅读设备等。 

 

一个外部样式表文件可以应用于多个页面。当你改变这个样式表文件时,所有页面的样式都随之而改变。在制作大量相同样式页面的网站时,非常有用,不仅减少了重复的工作量,而且有利于以后的修改、编辑,浏览时也减少了重复下载代码。 

 

样式表文件可以用任何文本编辑器(例如:记事本)打开并编辑,一般样式表文件扩展名为.css。内容是定义的样式表,不包含HTML标记,mystyle.css这个文件的内容如下: 

 

hr {color: sienna} 

p {margin-left: 20px} 

body {background-image: url("images/back40.gif")} 

/*定义水平线的颜色为土黄;段落左边的空白边距为20象素;页面的背景图片为images目录下的back40.gif文件*/ 

 

如ul{list-style-image:url(bullet.gif)} 

Ø 4. ID选择符 

 

在HTML页面中ID参数指定了某个单一元素,ID选择符是用来对这个单一元素定义单独的样式。 

ID选择符的应用和类选择符类似,只要把CLASS换成ID即可。将上例中类用ID替代: 

 

<p id="intro"> 

这个段落向右对齐 

</p> 

 

定义ID选择符要在ID名称前加上一个“#”号。和类选择符相同,定义ID选择符的属性也有两种方法。下面这个例子,ID属性将匹配所有id="intro"的元素: 

 

#intro 

font-size:110%; 

font-weight:bold; 

color:#0000ff; 

background-color:transparent 

 

(字体尺寸为默认尺寸的110%;粗体;蓝色;背景颜色透明) 

下面这个例子,ID属性只匹配id="intro"的段落元素: 

 

p#intro 

font-size:110%; 

font-weight:bold; 

color:#0000ff; 

background-color:transparent 

 

注意:ID选择符局限性很大,只能单独定义某个元素的样式,一般只在特殊情况下使用。 

 

5、margin:length|percentage|auto {1,4} 

Ø 7. 注释 

 

你可以在CSS中插入注释来说明你代码的意思,注释有利于你或别人以后编辑和更改代码时理解代码的含义。在浏览器中,注释是不显示的。CSS注释以"/*" 开头,以"*/" 结尾,如下: 

 

/* 定义段落样式表 */ 

text-align: center; /* 文本居中排列 */ 

color: black; /* 文字为黑色 */ 

font-family: arial /* 字体为arial */ 

 

/* 定义段落样式表 */ 

text-align: center; /* 文本居中排列 */ 

color: black; /* 文字为黑色 */ 

font-family: arial /* 字体为arial */ 

 

前面我们了解了CSS的语法,但要想在浏览器中显示出效果,就要让浏览器识别并调用。六、插入样式表的方法

当浏览器读取样式表时,要依照文本格式来读,这里介绍四种在页面中插入样式表的方法:[u]链入外部样式表[/u]、[u]内部样式表[/u]、[u]导入外表样式表[/u]和[u]内嵌样式[/u]。 

 

15、speak-punctuation:code|none 使更加富有文采。

Ø [定位]属性共有6项: 

「类型」(position),用于确定定位的类型,共有绝对(absolute)、相对(relative)和静态(static)等3种选择。 

「Z轴」(z-index),用于控制网页中块元素的叠放顺序,可为元素设置重叠效果。该属性的参数值使用纯整数,值为0时,元素在最下层,适用于绝对定位或相对定位的元素。 

「显示」(visibility)使用该属性可将网页中的元素隐藏,共有继承(inherit,继承母体要素的可视性设置)、可见(visible)和隐藏(hidden)等3种选择。 

「溢出」(overflow),在确定了元素的高度和宽度后,如果元素的面积不能全部显示元素中的内容时,该属性做一日和尚撞一天钟起作用了。其中共有可见(visible,扩大面积以显示所有内容)、隐藏(hidden,隐藏超出范围的内容)、滚动(scroll,在元素的右边显示一个滚动条)和自动(auto,当内容超出元素面积时,显示滚动条)等4种选择。 

「定位」,当为元素确定了绝对定位类型后,该组属性决定元素在网页中的具体位置。该组属性包含4个子属性,分别是「左」(属性名为「left」,控制元素左边的起始位置)、「上」(属性名为「top」,控制元素上面的起始位置)、 「宽」或「高」(与「盒子」类属性面板中「宽」或「高」的属性作用相同)。 

「剪辑」(clip),当元素被指定为绝对定位类型后,该属性可以把元素区域切成各种形状,但目前提供的只有方形一种。属性值为rect(top right bottom left),即: 

rect(top right bottom left),属性值的单位为任何一种长度单位。 

4、background-repeat:repeat|repeat-x|repeat-y|no-repeat 

Ø 文本样式(Text Style) 

序号 中文说明 标记语法 

1 行 间 距 {line-height:数值|inherit|normal;} 

2 文本修饰 {text-decoration:inherit|none|underline|overline|line-through|blink} 

3 段首空格   {text-indent:数值|inherit} 

4 水平对齐 {text-align:left|right|center|justify} 

5 垂直对齐 {vertical-align:inherit|top|bottom|text-top|text-bottom|baseline|middle|sub|super} 

6 书写方式 {writing-mode:lr-tb|tb-rl} 

1、word-spacing:normal|length 

Ø 框架样式(Box Style) 

序号 中文说明 标记语法 

1 边界留白 {margin:margin-top margin-right margin-bottom margin-left} 

2 补  白 {padding:padding-top padding-right padding-bottom padding-left} 

3 边框宽度 {border-width:border-top-width border-right-width border-bottom-width border-left-width}  

宽度值: thin|medium|thick|数值 

4 边框颜色 {border-color:数值 数值 数值 数值}  数值:分别代表top、right、bottom、left颜色值 

5 边框风格 {border-style:none|hidden|inherit|dashed|solid|double|inset|outset|ridge|groove} 

6 边  框 {border:border-width border-style color} 

   上 边 框 {border-top:border-top-width border-style color} 

   右 边 框 {border-right:border-right-width border-style color} 

   下 边 框 {border-bottom:border-bottom-width border-style color} 

   左 边 框 {border-left:border-left-width border-style color} 

7 宽  度 {width:长度|百分比| auto} 

8 高  度 {height:数值|auto} 

9 漂  浮 {float:left|right|none} 

10 清  除 {clear:none|left|right|both} 

24、height:length|auto 

Ø 字体样式(Font Style)

 

序号 中文说明 标记语法 

1 字体样式 {font:font-style font-variant font-weight font-size font-family} 

2 字体类型 {font-family:"字体1","字体2","字体3",...} 

3 字体大小 {font-size:数值|inherit| medium| large| larger| x-large| xx-large| small| smaller| x-small| xx-small} 

4 字体风格 {font-style:inherit|italic|normal|oblique} 

5 字体粗细   {font-weight:100-900|bold(粗体)|bolder(特粗)|lighter(细体)|normal(正常);} 

6 字体颜色   {color:数值;} 

7 阴影颜色 {text-shadow:16位色值} 

8 字体行高   {line-height:数值|inherit|normal;} 

9 字 间 距   {letter-spacing:数值|inherit|normal} 

10 单词间距 {word-spacing:数值|inherit|normal} 

11 字体变形 {font-variant:inherit|normal|small-cps } 

12 英文转换 {text-transform:inherit|none|capitalize|uppercase|lowercase} 

13 字体变形 {font-size-adjust:inherit|none} 

14 字体 {font-stretch:condensed|expanded|extra-condensed|extra-expanded|inherit|narrower|normal| semi-condensed|semi-expanded|ultra-condensed|ultra-expanded|wider} 

3、使CSS更容易和更强大 

Ø [类型]属性共有九项: 

 

「字体」(font-family),设定时,需考虑浏览器中有无该字体。 

「大小」(font-size),注意度量单位。 

「粗细」(font-weight),除了normal(正常)、bold(粗体)、bolder(特粗)、lighter(细体)外,还有9种以像素为度量为单位的设置方式。 

「样式」(font-style),也就是字型。 

「行高」(line-height),就是行距。注意,行距只能以是字体大小值为 

「变形」(font-variant),可以将正常文字一半尺寸后大写显示,但IE目前不支持这项属性。 

「大小写」(text-transform),这项属性能轻而易举地控制字母大小写,有首字大写(capitalize、大写(uppercase)、小写(lowercase)和无(none,使所有继承文字和变形参数被忽略,文字将以正常形式显示)等4种。 

「修饰」(text-decoration),用于控制链接文本的显示形态,有下划线(underline)、无下划线(overline)、删除线(line-through)、闪烁(blink)和无(none ,使上述效果均不会发生)等5种修饰方式。但IE4不支持文字闪烁。 

使用元素的position属性,有绝对定位(absolute)和相对定位(relative)。 

Ø 2CSS ID 的命名 

外 套:  wrap 

主导航:  mainnav 

子导航:  subnav 

页 脚:  footet 

整个页面: content 

页 眉:  header 

页 脚:  footer 

商 标:  label 

标 题:  title 

主导航:  nav(mainnav/globalnav) 

顶导航:  topnav 

边导航:  sidebar 

左导航:  leftsidebar 

右导航:  rightsidebar 

当前位置: loc 

旗 志:  logo 

标 语:  banner 

菜单内容1: menu1 content 

菜单容量: menu container 

子菜单:  submenu 

边导航图标:sidebarIcon 

注释:   note 

面包屑:  breadcrumb(即页面所处位置导航提示) 

容器:   container 

内容:   content 

搜索:   search 

登陆:   Login 

功能区:  shop(如购物车,收银台) 

当前的   current 

网站公用相关 

Container div #container 容器 

Header or banner div #header 页头部分  

 

Main or global navigation div #main-nav 主导航 

Menu #menu 菜单 

Sub Menu #submenu 子菜单 

Left or right side columns #sidebar-a, #sidebar-b 左边栏或右边栏 

Main div #main 页面主体 

Content div #content 内容部分 

The main content area #content-main 主要内容区域 

Footer div #footer 页脚部分 

Tag #tag 标签 

Message #msg #message 提示信息 

Tips #tips 小技巧 

Vote #vote 投票 

Friend Link #friendlink 友情连接 

Title #title 标题 

Summary #summary 摘要 

Sub-navigation list #sub-nav 二级导航 

Search input #search-input 搜索输入框 

Search output #search-output 搜索输出和搜索结果相似 

Search #search 搜索 

Search results #search-results 搜索结果 

Copyright information #copyright 版权信息 

brand #branding 商标 

branding-logo #branding-logo LOGO 

Site information #siteinfo 网站信息 

Copyright information etc. #siteinfo-legal 法律声明 

Designer or other credits #siteinfo-credits 信誉 

Join us #joinus 加入我们 

Partnership opportunities #partner 合作伙伴 

Services #service 服务 

Regsiter #regsiter 注册 

Status #status 状态 

电子贸易相关 

Products .products 产品 

Products prices .products-prices 产品价格 

Products description .products-description 产品描述 

Products review .products-review 产品评论 

Editor's review .editor-review 编辑评论 

New release .news-release 最新产品 

Publisher .publisher 生产商 

Screen shot .screenshot 缩略图 

FAQ .faqs 常见问题 

Keyword .keyword 关键词 

Blog .blog 博客 

Forum .forum 论坛 

2.另外在编辑样式表时可用的注释可这样写: 

<-- Footer --> 

内容区 

<-- End Footer --> 

3.样式文件命名 

主要的 master.css 

布局,版面 layout.css 

专栏 columns.css 

文字 font.css 

打印样式 print.css 

主题 themes.css 

 

4、vertical-align:baseline|sub|super|top|text-top|middle|bottom|text-bottom|percentage 

Ø 5. 包含选择符 

 

可以单独对某种元素包含关系定义的样式表,元素1里包含元素2,这种方式只对在元素1里的元素2定义,对单独的元素1或元素2无定义,例如: 

 

table a 

font-size: 12px 

 

在表格内的链接改变了样式,文字大小为12象素,而表格外的链接的文字仍为默认大小。 

 

inherit(继承)是默认值。

Ø [边框]的属性有3项: 

 

「宽」(border-width),控制边框的宽度,其中分为4个属性:border-top-width顶边框的宽度、border-right-width右边框的宽度、border-bottom-width底边框的宽度、border-left-width左边框的宽度。 

「颜色」(border-color),设置各边框的颜色。若要使边框的四边显示不同的颜色,可在设置中分别列出。如, 

p{: #ff0000 #009900 #0000ff #55cc00} 

浏览器将四种颜色依次理解为:上边框、右边框、底边框和左边框(自上开始顺时针)。 

「样式」(border-style),设定边框的样式,共有无(none)、虚线(dotted)、点划线线(dotted)、点划线(dashed)、实线(solid)、双线(double )、槽状(grove)、脊状(ridge)、凹陷(inset)和凸起(outset)等9种。 

6、FlipV 语法:filter:FlipV 垂直翻转。

Ø 「盒子」属性共有6项: 

「宽」(width),确定盒子本身的宽度,可以使盒子的宽度不依靠它所包含的内容多少。 

「高」(height),确定盒子本身的高度。 

「浮动」(float),设置块元素的浮动效果。 

「清除」(clear),用于清除设置的浮动效果。 

「边距」(margin),控制围绕边框的边距大小。其中包含4个属性:margin-top控制上边距的宽度、margin-right控制右边距的宽度、margin-bottom控制下边距的宽度、margin-left控制左边距的宽度。 

「边界」(padding),确定围绕块元素的空格填充数量,其中包含4个属性「padding-top控制上留白的宽度、padding-right控制右留白的宽度、padding-bottom控制下留白宽度、padding-left控制左留白的宽度。 

5、3D层技术 

Ø CSS符号属性:

list-style-type:none; /*不编号*/ 

list-style-type:decimal; /*阿拉伯数字*/ 

list-style-type:lower-roman; /*小写罗马数字*/ 

list-style-type:upper-roman; /*大写罗马数字*/ 

list-style-type:lower-alpha; /*小写英文字母*/ 

list-style-type:upper-alpha; /*大写英文字母*/ 

list-style-type:disc; /*实心圆形符号*/ 

list-style-type:circle; /*空心圆形符号*/ 

list-style-type:square; /*实心方形符号*/ 

list-style-image:url(/dot.gif); /*图片式符号*/ 

list-style-position: outside; /*凸排*/ 

list-style-position:inside; /*缩进*/ 

1、display:block|inline|list-item|none

Ø CSS框线一览表:

border-top : 1px solid #6699cc; /*上框线*/ 

border-bottom : 1px solid #6699cc; /*下框线*/ 

border-left : 1px solid #6699cc; /*左框线*/ 

border-right : 1px solid #6699cc; /*右框线*/ 

以上是建议书写方式,但也可以使用常规的方式 如下:

border-top-color : #369 /*设置上框线top颜色*/ 

border-top-width :1px /*设置上框线top宽度*/ 

border-top-style : solid/*设置上框线top样式*/ 

其他框线样式

solid /*实线框*/ 

dotted /*虚线框*/ 

double /*双线框*/ 

groove /*立体内凸框*/ 

ridge /*立体浮雕框*/ 

inset /*凹框*/ 

outset /*凸框*/ 

第四章 CSS属性 

四、CSS属性大全 

一、属性

Ø 列表属性: (List-style)

类型list-style-type:    disc;(圆点) circle;(圆圈) square;(方块) decimal;(数字) lower-roman;(小罗码数字) upper-roman; lower-alpha; upper-alpha;

位置list-style-position: outside;(外) inside;

图像list-style-image: url(..);

2、相对长度值:CSS支持以下单位pc,em,ex

Ø 八、CSS边界样式:

margin-top:10px; /*上边界*/ 

margin-right:10px; /*右边界值*/ 

margin-bottom:10px; /*下边界值*/ 

margin-left:10px; /*左边界值*/ 

 

 

 

 

第三章 CSS进一步学习 

Ø 区块属性: (Block) /*这个属性第一次认识,要多多研究*/

字间距 {letter-spacing: normal;} 数值 /*这个属性似乎有用,多实践下*/

对齐 {text-align: justify;}(两端对齐) left;(左对齐) right;(右对齐) center;(居中)

缩进 {text-indent: 数值px;}

垂直对齐 {vertical-align: baseline;}(基线) sub;(下标) super;(下标) top; text-top; middle; bottom; text-bottom;

词间距word-spacing: normal; 数值

空格white-space: pre;(保留) nowrap;(不换行)

 

显示 {display:block;}(块) inline;(内嵌) list-item;(列表项) run-in;(追加部分) compact;(紧凑) marker;(标记) table; inline-table; table-raw-group; table-header-group; table-footer-group; table-raw; table-column-group; table-column; table-cell; table-caption;(表格标题) /*display 属性的了解很模糊*/

 

设置文字在背景图案上面滚动,背景图案保持固定不动用fixed. 

Ø 3. 类选择符 

 

用类选择符你能够把相同的元素分类定义不同的样式,定义类选择符时,在自定类的名称前面加一个点号。假如你想要两个不同的段落,一个段落向右对齐,一个段落居中,你可以先定义两个类: 

 

p.right {text-align: right} 

p.center {text-align: center} 

 

然后用不在不同的段落里,只要在HTML标记里加入你定义的class参数: 

<p class="right"> 这个段落向右对齐的 

</p> 

 

<p class="center"> 

这个段落是居中排列的 

</p> 

 

<p class="right"> 这个段落向右对齐的 

</p> 

 

<p class="center"> 

这个段落是居中排列的 

</p> 

 

注意:类的名称可以是任意英文单词或以英文开头与数字的组合,一般以其功能和效果简要命名。 

 

类选择符还有一种用法,在选择符中省略HTML标记名,这样可以把几个不同的元素定义成相同的样式: 

 

.center {text-align: center} 

 

(定义.center的类选择符为文字居中排列) 

这样的类可以被应用到任何元素上。下面我们使h1元素(标题1)和p元素(段落)都归为“center”类,这使两个元素的样式都跟随“.center”这个类选择符: 

 

<h1 class="center"> 

这个标题是居中排列的 

</h1> 

<p class="center"> 

这个段落也是居中排列的 

</p> 

 

注意:这种省略HTML标记的类选择符是我们经后最常用的CSS方法,使用这种方法,我们可以很方便的在任意元素上套用预先定义好的类样式。 

 

三、为超文本链接设置目标框架

 2. 内部样式表 

 

内部样式表是把样式表放到页面的<head>区里,这些定义的样式就应用到页面中了,样式表是用<style>标记插入的,从下例中可以看出<style>标记的用法: 

 

<head> 

…… 

<style type="text/css"> 

hr {color: sienna} 

p {margin-left: 20px} 

body {background-image: url("images/back40.gif")} 

</style> 

…… 

</head> 

 

注意:有些低版本的浏览器不能识别style标记,这意味着低版本的浏览器会忽略style标记里的内容,并把style标记里的内容以文本直接显示到页面上。为了避免这样的情况发生,我们用加HTML注释的方式(<!-- 注释 -->)隐藏内容而不让它显示: 

 

<head> 

…… 

<style type="text/css"> 

<!-- 

hr {color: sienna} 

p {margin-left: 20px} 

body {background-image: url("images/back40.gif")} 

--> 

</style> 

…… 

</head> 

 

3、list-style-type:disc|circle|square|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha|none

Ø 背景属性: (background)

色彩 {background-color: #FFFFFF;}

图片 {background-image: url();}

重复 {background-repeat: no-repeat;}

滚动 {background-attachment: fixed;}(固定) scroll;(滚动)

位置 {background-position: left;}(水平) top(垂直);

简写方法 {background:#000 url(..) repeat fixed left top;} /*简写·这个在阅读代码中经常出现,要认真的研究*/

 

2、编辑CSS文档:与编辑HTML的方法一样。有如下3种:

Ø 6. 样式表的层叠性 

 

层叠性就是继承性,样式表的继承规则是外部的元素样式会保留下来继承给这个元素所包含的其他元素。事实上,所有在元素中嵌套的元素都会继承外层元素指定的属性值,有时会把很多层嵌套的样式叠加在一起,除非另外更改。例如在DIV标记中嵌套P标记: 

div { color: red; font-size:9pt} 

…… 

<div> 

<p> 

这个段落的文字为红色9号字 

</p> 

</div> 

 

(P元素里的内容会继承DIV定义的属性) 

注意:有些情况下内部选择符不继承周围选择符的值,但理论上这些都是特殊的。例如,上边界属性值是不会继承的,直觉上,一个段落不会同文档BODY一样的上边界值。 

 

另外,当样式表继承遇到冲突时,总是以最后定义的样式为准。如果上例中定义了P的颜色: 

 

div { color: red; font-size:9pt} 

p {color: blue} 

…… 

<div> 

<p> 

这个段落的文字为蓝色9号字 

</p> 

</div> 

 

我们可以看到段落里的文字大小为9号字是继承div属性的,而color属性则依照最后定义的。 

 

不同的选择符定义相同的元素时,要考虑到不同的选择符之间的优先级。ID选择符,类选择符和HTML标记选择符,因为ID选择符是最后加上元素上的,所以优先级最高,其次是类选择符。如果想超越这三者之间的关系,可以用!important提升样式表的优先权,例如: 

 

p { color: #FF0000!important } 

.blue { color: #0000FF} 

#id1 { color: #FFFF00} 

 

我们同时对页面中的一个段落加上这三种样式,它最后会依照被!important申明的HTML标记选择符样式为红色文字。如果去掉!important,则依照优先权最高的ID选择符为黄色文字。 

 

7、background:background-color|background-image|background-repeat|background-attachment|background-position 

5. 多重样式表的叠加 

 

上一章里我们已经提到样式表的层叠顺序,这里我们讨论插入样式表的这几种方法的叠加,如果在同一个选择器上使用几个不同的样式表时,这个属性值将会叠加几个样式表,遇到冲突的地方会以最后定义的为准。例如,我们首先链入一个外部样式表,其中定义了h3选择符的color 、text-alig和font-size属性: 

 

h3 

color: red; 

text-align: left; 

font-size: 8pt; 

/*标题3的文字颜色为红色;向左对齐;文字尺寸为8号字*/ 

 

然后在内部样式表里也定义了h3选择符的text-align和font-size属性: 

 

h3 

text-align: right; 

font-size: 20pt; 

/*标题3文字向右对齐;尺寸为20号字*/ 

 

那么这个页面叠加后的样式就是: 

 

color: red; 

text-align: right; 

font-size: 20pt; 

/*文字颜色为红色;向右对齐;尺寸为20号字*/ 

 

字体颜色从外部样式表里保留下来,而对齐方式和字体尺寸都有定义时,按照后定义的优先而依照内部样式表。 

 

注意:依照后定义的优先,所以优先级最高的是[s]内嵌样式[/s],[s]内部样式表[/s]高于[s]导入外部样式表[/s],[s]链入的外部样式表[/s]和[s]内部样式表[/s]之间是最后定义的优先级高。 

 

<link rel="stylesheet" rev="stylesheet" href="css/style.css" type="text/css" media="all" /> 

<style type="text/css" media="all">@import url( css/style01.css );</style>  

第七章 CSS定位 

Ø 背景样式 

序号 中文说明 标记语法 

1 背景颜色 {background-color:数值} 

2 背景图片 {background-image: url(URL)|none} 

3 背景重复 {background-repeat:inherit|no-repeat|repeat|repeat-x|repeat-y} 

4 背景固定 {background-attachment:fixed|scroll} 

5 背景定位 {background-position:数值|top|bottom|left|right|center} 

6 背影样式 {background:背景颜色|背景图象|背景重复|背景附件|背景位置} 

一、长度单位

Ø 方框属性: (Box)

width:; height:; float:; clear:both; margin:; padding:;     顺序:上右下左

边框属性: (Border)

border-style: dotted;(点线) dashed;(虚线) solid(实线); double;(双线) groove;(槽线) ridge;(脊状) inset;(凹陷) outset;

border-width:; 边框宽度

border-color:#;

 

简写方法border:width style color; /*简写*/

 

5、list-style-position:inside|outside 

3. 导入外部样式表 

 

导入外部样式表是指在内部样式表的<style>里导入一个外部样式表,导入时用@import,看下面这个实例: 

 

<head> 

…… 

<style type=”text/css”> 

<!-- 

@import “mystyle.css” 

其他样式表的声明 

--> 

</style> 

…… 

</head> 

 

例中@import “mystyle.css”表示导入mystyle.css样式表,注意使用时外部样式表的路径。方法和链入样式表的方法很相似,但导入外部样式表输入方式更有优势。实质上它相当于存在内部样式表中的。 

注意:导入外部样式表必须在样式表的开始部分,在其他内部样式表上面。 

 

5、background-attachment:scroll|fixed 

三、CSS样式 

8、Gray 语法:filter:Gray 把一张图变为灰度图。

五、css基本语法 

CSS的定义是由三个部分构成:选择符(selector),属性(properties)和属性的取值(value)。 

基本格式如下: 

备注:

Ø 字体属性:(font)

大小 {font-size: x-large;}(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX、PD

样式 {font-style: oblique;}(偏斜体) italic;(斜体) normal;(正常)

行高 {line-height: normal;}(正常) 单位:PX、PD、EM

粗细 {font-weight: bold;}(粗体) lighter;(细体) normal;(正常)

变体 {font-variant: small-caps;}(小型大写字母) normal;(正常)

大小写 {text-transform: capitalize;}(首字母大写) uppercase;(大写) lowercase;(小写) none;(无)

修饰 {text-decoration: underline;}(下划线) overline;(上划线) line-through;(删除线) blink;(闪烁)

 

常用字体: (font-family)

"Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana

 

2、white-space:normal|pre|nowrap

Ø CSS表单运用:

文字方块 

按钮 

复选框 

选择钮 

多行文字方块 

下拉式菜单 选项1选项2 

适用于块级元素,定义文本首行的缩进方式。如p{text-indent:1cm} 

二、css属性代码大全

11、pitch:hertz|x-low|low|medium|high|x-high 音高标准。

Ø CSS背景样式:

background-color:#F5E2EC; /*背景颜色*/ 

background:transparent; /*透视背景*/ 

background-image : url(/image/bg.gif); /*背景图片*/ 

background-attachment : fixed; /*浮水印固定背景*/ 

background-repeat : repeat; /*重复排列-网页默认*/ 

background-repeat : no-repeat; /*不重复排列*/ 

background-repeat : repeat-x; /*在x轴重复排列*/ 

background-repeat : repeat-y; /*在y轴重复排列*/ 

 

制定背景位置

background-position : 90% 90%; /*背景图片x与y轴的位置*/ 

background-position : top; /*向上对齐*/ 

background-position : buttom; /*向下对齐*/ 

background-position : left; /*向左对齐*/ 

background-position : right; /*向右对齐*/ 

background-position : center; /*居中对齐*/ 

body{background-image:url(marble.jpg)} 

Ø [区块]属性共有六项: 

 

「单词间距」(word-spacing),主要用于控制文字间相隔的距离。有正常(normal)和值(自定义间隔值)两种选择方式。当选择值时,可用的单位有英吋(in)、厘米(cm)、毫米(mm)、点数(pt)、12pt字(pc)、字体高(em)、字体x有高(ex)像素(px)。 

「字母间距」(letter-spacing),其作用与字符间距类似,也有正常(normal)和值(自定义间隔值)两种选择方式。 

「垂直对齐」(vertical-align),控制文字或图像相对于其母体元素的垂直位置。如将一个2×3像素的GIF图像同其母体元素文字的顶部垂直对齐,则该GIF图像将在该行文字的顶部显示。共有基线(baseline,将元素的基准线同母体元素的基准线对齐)、下标(sub,将元素以下标的形式显示),上标(super,将元素以上标的形式显示)、顶部(top ,将元素顶部同最高的母体元素对齐)、文本顶对齐(text-top,将元素的顶部同母体元素文字的顶部对齐)、中线对齐(middle,将元素的中点同母体元素的中点对齐)、底部(bottom,将元素的底部同最低的母体元素对齐)及值(自定义)等9种选择。 

「文本对齐」(text-align),设置块的水平对齐方式。共有左对齐(left)、右对齐(right)、居中(center)和均分(justify)等4种选择。 

「文字缩进」(text-indent),控制块的缩进程度。 

「空白间距」(white-space),在HTML中,空格是被省略的;在CSS中则使用属性(white-space)控制空格的输入。共有正常(normal)、保留(pre)和不换行(nowrap)等3种选择。 

使用flow:属性。如p{flow:main}使<P>内的内容都放在main框架中。

Ø 1.选择符

selector {property: value} 

(选择符 {属性:值}) 

选择符是可以是多种形式,一般是你要定义样式的HTML标记,例如BODY、P、TABLE……,你可以通过此方法定义它的属性和值,属性和值要用冒号隔开: 

body {color: black} 

选择符body是指页面主体部分,color是控制文字颜色的属性,black是颜色的值,此例的效果是使页面中的文字为黑色。 

如果属性的值是多个单词组成,必须在值上加引号,比如字体的名称经常是几个单词的组合: 

p {font-family: "sans serif"} 

(定义段落字体为sans serif) 

如果需要对一个选择符指定多个属性时,我们使用分号将所有的属性和值分开: 

p {text-align: center; color: red} 

(段落居中排列;并且段落中的文字为红色) 

为了使你定义的样式表方便阅读,你可以采用分行的书写格式: 

text-align: center; 

color: black; 

font-family: arial 

(段落排列居中,段落中文字为黑色,字体是arial) 

选择附中的元素类型可以省略而使用缺省值如:link{color:red} 
伪类可以被用在关联选择符里:a:link img{border:solid blue} 
伪类可以与通用类组合:a.external:visited{color:blue} 

Ø [扩展]属性共有两部分: 

「分页」,其中两个属性的作用是为打印的页面设置分页符。 「之前」(page-break-before);「之后」(page-break-after)。 

「视觉效果」,其中两个属性的作用是为网页中的元素施加特殊效果。 「光标」(cusor),可以指定在某个元素上要使用的光标形状,共有15种选择方式,分别代表鼠标在Windows操作系统中的各种形状。另外它还可以指定指针图标的URL地址;「滤镜」(fiter),可以为网页中元素施加各种奇妙的滤镜效果,共包含有16种滤镜 

23、width:length|percentage|auto 

9、Invert 语法:filter:Invert 底片效果。

5、FlipH 语法:filter:FlipH 水平翻转。

1、请参考《CSS网页样式设计——CSS使用详解》黄斯伟著 人民邮电出版社出版。

7、background:transparent|color|url|blend-direction|repeat|scroll|position 

一、字体属性

18、border-top:border-top-width|border-style|color 

第六章 CSS格式化模型 

21、border-left:同上 

第二章 CSS初步了解 

11、border-top-width:thin|medium|thick|length 

6、background-position:percentage|length{1,2}|top|center|bottom|left|center|right 

13、Wave 语法:filter:Wave(add=,freq=,LightScrength=,Phase=,Strenth=) 波动效果。

有几种方法使CSS更容易和更强大: 

13、border-bottom-width:同上 

11、Mask 语法:filter:Mask(color=) 为对象建立一个覆盖于表面的膜。

7、padding-right:同上 

在文档<HEAD>中用<Style type="text/css"></style>定义; 
使用<LINK>元素链接到外部的样式表单。<LINK REL="stylesheet" href="style1.css">; 
在<BODY>内部的元素中使用<STYLE>定义CSS,如<H3 Style="">; 
使用CSS "@import"标记来导入样式表单;
 
2、选择符 

5、text-transform:capitalize|uppercase|lowercase|none 

8、padding-bottom:同上 

4、pause:是2和3的简便指定形式。

2、font-style:normal|italic|oblique 

与字体有关的属性包括:font-family,font-style,font-variant,font-weight,font-size,font。执行顺序是:font-style,font-variant,font-weight,font-size 

19、border-right:同上 

一个元素顶边的宽度、样式和颜色都可以border-top一次指定。 

em代表的高度就是大写字母"M"(或者"H")的高度。优越性是设计者和用户都具有对字体大小的控制权,缺陷是早期版本的浏览器不支持。
 
二、颜色单位
用百分比值来表示;如color:rgb(50%,0,50%) 
使用0-255之间的整数值来设置:如color:rgb(128,0,128) 
使用十六进制数组定义颜色:如#fc0eab 
使用简化的十六进制数定义颜色:如#080 
为颜色取名:aqua,black,blue,fuchsia,gray,green,lime,maroon,navy,olive,purple,red,silver,teal,white,yellow 

二、颜色和背景属性

四、容器属性

六、鼠标属性

14、richness:% 阅读声音的饱满程度。

2、伪类: 

1、注释语句:/*在这里加入注释*/ 

4、dropshadow 语法:filter:DropShadow(color=,OffX=,OffY=,Positive=) 添加对象的阴影效果。

2、letter-spacing:normal|length 

1、position:absolute|relative|static

任何一个html标记都可以作为选择符。但是有时用class和id更方便。class总以.号开头,id以#开头。class和id用法差不多,用id给选择符一个独有的名字,在调用script时会更容易。但是,如果使用样式表单而不使用script,用class比id好。 

6、padding-top:length|percentage 

6、padding:values 

3、width,height:length|percentage|auto

target:_blank 打开新窗口。 
target:_popup 打开新的弹出窗口,通常没有变框,适用于消息、警告等。 
target:_self 在当前框架结构中打开,会覆盖当前内容。 
target:_parent 在当前一级的上级框架里打开,如果没有上级框架,则会在自身框架打开。 
target:_top 在当前窗口打开,覆盖所有的框架内容。
 
四、处理“溢出”

一、通用声音属性

1、CSS是Cascading Style Sheets(层叠样式表单)的简称。通常所称的CSS是指CSS1,即层叠样式表单1级。

opacity代表透明度,从0-100。 
finishopacity指定渐变时的结束透明度。 
style指定了透明区域的形状特征。0-统一形状;1-线形;2-放射状;3-长方形。 
startX和startY代表透明效果开始的x,y坐标; 
finishX和finishY代表结束的x,y坐标。 

10、padding:length|percentage {1,4} 

第十二章 CSS滤镜和渐变

5、cue,cue-before,cue-after:url|none

capitalize:每个单词的第一个字母大写。 
uppercase:所有字都大写。 
lowercase:所有字都小写。 

add指定图片是否被改变成印象派的模糊效果。true,false 对文字设定为add=1时效果很好。 
direction设置模糊的方向。有0,45,90,135,180,225,270,315 
strength 只能是整数,代表有多少像素的宽度将受到模糊影响。默认值是5。
 
3、chroma 语法:filter:chroma(color=) 设置一个对象中指定的颜色为透明色。

前面四个属性都可以用border-width来定义。可以一次给出一个、两个、三个或者四个border-width值。如果给出的值少于四个,那么缺失的部分就取其对边的值。如h1{border-width:thick thin medium} 

第五章 CSS的单位

body{background-image:url(marble.jpg);background-repeat:repeat-y} 

10、voice-family:specific-voice|generic-voice| 

4、list-style-image:url|none 

17、speak-numeral:digits|continous|none 阅读数字的方法。

2、margin-right:同上 

2、以上CSS均指CSS1.

第八章 CSS打印支持(略)

17、border-style:none|dotted|dash|solid|double|groove|ridge|inset|outset 

在h3{font-family:arial}里h3是选择符。font-family是属性,arial是属性值。属性和属性值之间以冒号分隔。如果要定义多个属性,属性与属性之间以分号隔开。要为一个属性定义多个属性值,则用逗号隔开。 

6、font:font-style|font-variant|font-weight|font-size|line-height|font-family 

1、parent:<frame name> 

20、border-bottom:同上 

18、speak-time:24|12|none 控制是否把时间按照24小时制阅读。

包括剪切(clip)、溢出(overflow)、可见性(visibility)属性。剪切属性可以让一些被覆盖的对象显示出来,溢出属性用来指定如果对象放在一个比它小的边框中该怎样处理,可见性属性可以控制一个对象是否看得见——这些是制作特效的好办法。 

可以一次设置前面的所有的有关背景的属性。如body{background:white url(bg.jpg)} 

shape:rect(top,right,bottom,left),

三、文本属性

  filter:filtername()是实现滤镜样式的属性。对于一个元素可以作用多个滤镜属性。

决定列项的第二行左边距是否与第一行除了项目符号以外的第一个字母对齐。 

26、clear:none|left|right|both 

1、将样式与HTML结合:共有四种方法。 

6、特殊效果 

overflow决定了元素的内容在超越它的宽度和高度限制时,浏览器怎样处理。使用visible,元素的宽度可以比原先声明的更大。任何填充距或边框都保留并相应扩大。使用hidden,则任何超出原先声明的宽度和高度的内容都会变得不可见。使用auto时,一般超过高度或宽度时,浏览器会提供一组滚屏工具。使用scroll,表示如果浏览器支持滚屏工具,无论元素内容是否超越了边界,这个工具都应该被显示。这避免了载一些动态显示的状态下,滚动条是否需要显示的混乱问题。

add 默认值为true 表示是否要把对象按照垂直的波形样式打乱。 
freq是波纹频率。指定在这个对象上面一共需要产生多少个完整的波纹。 
lightstrength可对波纹增强光影效果。从0-100。 
phase 设置正弦波开始的便宜量。0-100。 
strength 代表振幅大小。 
14、Xray 语法:filter:Xray 反映出对象的轮廓并把轮廓增亮。

6、text-align:left|right|center|justify 

4、margin-left:同上 

3、layout:fill|fixed|row|column 

8、line-height:normal|number|length|percentage 

15、border-width:thin|medium|thick|length {1,4} 

可以一次指定list-style-type,list-style-image,list-style-position属性。 

overflow:autoscroll|scrollbar|hand|button|any

16、speak-date:myd|dmy|ymd 指定阅读日期的方式。

用常见的超文本编辑器来实现,如Frontpage,Dreamweaver; 
用任何不带格式的文本编辑器来编写,后缀名为.htm或.html,如记事本、写字板; 
用任何不带格式的文本编辑器来编写,后缀名为.css。 

5、overflow:visible|hidden|scroll|auto

cursor:auto|crosshair|default|hand|move|e-resize|ne-resize|nw-resize|n-resize|se-resize|sw-resize|s-resize|w-resize|text|wait|help

7、visibility:inherit|visible|hidden

disc:圆盘 
circle:圆圈 
square:方块 
decimal:十进制数1、2、3…… 
lower-roman:小写罗马数字i,ii,iii... 
upper-roman:大写罗马数字I,II,III... 
lower-alpha:小写字母a,b,c... 
upper-alpha:大写字母A,B,C... 

7、Glow 语法:filter:Glow(color=,strength=) 边缘发光效果。strength是从1到255之间的数。

4、clip:shape|auto

4、层叠顺序的具体规则: 

使用z-index属性。 

2、blur 语法:filter:blur(add=,direction=,strength=) 作用是产生模糊效果。

URL单位的具体格式是:在“url”后面紧跟一个括号,括号中是url的地址。如果在地址中使用了括号、逗号、空格、单引号河双引号,那么就必须在整个地址的外面加上一对单引号或者双引号。地址可以是相对地址或绝对地址。 

12、border-right-width:同上 

1、volume:%|silent|x-soft|soft|medium|loud|x-loud

1、color:一般指前景色。 

选择符里的伪元素:p.initial:first-letter{color:red} 

9、padding-left:同上 

positive 为true时可以为任何的非透明像素建立可见的投影。为false时就为透明的像素部分建立可见的投影。 

使用上下文关联的选择符:如strong em{color:red} 
选择符编组:如h1,strong em,td{color:blue;} 
简化编码:如em{font:12pt/14pt bolder arial,helvetical} 
使用锚伪类:如a:link{color:red},选择附中的元素类型可以省略而使用缺省值如:link{color:red} 

如果只给出一个值,那么四条边框的颜色都一样。否则缺失边的颜色从对边获取。 

  相对定位:允许元素在相对于文档布局的原始位置上进行偏移(OFFSET)操作。 

二、将html元素与框架关联

如body{margin-top:0} 

2、left,top:length|percentage|auto

position,left,top,width,height,clip,overflow,z-index,visibility

这个属性用来对齐图片效果特别好。如image{vertical-align:baseline} 

4、font-weight:normal|bold|bolder|lighter|100|200|300|400|500|600|700|800|900
normal相当于400,bold相当于700 

前面四个属性都可以用padding来定义。如果给出的值少于四个,那么缺失的部分就取其对边的值。 

16、border-color:<color> {1,4} 

7、text-indent:length|percentage 

适用float元素可以使文字环绕在一个元素的四周。比html中的align属性应用范围更广,不仅仅是图片和表格,所有的元素都可以使用float属性。 

第十章 CSS与HTML(略)

一、CSS定位的属性

2、pause-before:时间值|百分比值 表示在元素前的停顿

一个剪切区域定义了元素的哪一个矩形部分可见。

前四个属性都可以用margin来定义。如果给出的值少于四个,那么缺失的部分就取其对边的值。 

五、分级属性

10、Light 语法:filter:Light 模拟光源的投射效果。

<target:>属性。

font属性可以一次定义前边提到的所有的字体属性。 

14、border-left-width:同上 

http://www.blueidea.com/bbs/newsdetail.asp?id=2115653&posts=current
第一章 概述
一、CSS简介

13、stress:% 语音强调的级别。

fill是默认值,也是传统布局规定。把框架中的内容按照浏览器传统的方法排列出来成为一个html文档,left,top,right,bottom值都会被忽略不计。 
fixed:把没一个元素都放置在相对于框架结构的固定位置上。 
layout:row 把框架结构按照一个单一列的形式互相紧挨着排列起来。 
layout:column 把框架结构按照一个单一行的形式互相紧挨着排列起来。
 
4、content:<url>|normal 

——全部完——

6、list-style:keyword|position|url 

8、elevation:angle|below|level|above|higher|lower 设置音源的仰角位置。

7、azimuth:角度值|left-side|far-left|left|center-left|center|center-right|right|far-right|right-side|behind|leftwards|rightwards 提供声音场幻境效果。

6、play-during:url|mix?repeat?|auto|none 指定背景声音。

3、margin-bottom:同上 

4、定位 

3、text-decoration:none|underline|overline|line-through|blink 

"@page"允许用户定义最外围层的框架属性;"@frame"允许用户定义嵌入的框架。 

absolute是绝对定位;relative是相对定位,在scripting语言实现动画特效的时候非常有用处;static是默认状态,没有定位功能。

第十一章 声音层叠样式表单

3、pause-after:同上 表示在元素后的停顿

3、background-image: 

2、background-color:背景色。 

首行伪元素:p:first-line{font-style:small-caps} 首字伪元素:p:first-letter{font-style:small-caps} 

25、float:left|right|none 

9、speech-rate:number|x-slow|slow|medium|fast|x-fast|faster|slower 阅读的速度。

5、border:length|style|url|color 

第九章 CSS与框架结构

与float相对应。如果为right,则元素的右边不会放进任何对象。 

12、pitch-range:% 0%音量代表平缓、单调的声音;50%代表普通声音;大于50%代表颤音。

左上角顶点是定位的取值参考点。css格式化是将对象放置在一个个矩形的"容器"中,这个矩形的左上角顶点就是定位的取值参考点。任何left和top值都是相对左上角而言的。left是容器的左上顶点到上级元素左边界之间的距离;top是容器的左上顶点到上级元素上边界之间的距离。

2、zindex:<number> 

要一次设置一个元素所有边框的宽度、样式和颜色,可以使用border。border只能使四条边框都相同。 

dotted:点组成的虚线。 
dash:短线组成的虚线。 
double:双线。 
groove:3D沟槽状边框。 
ridge:3D脊状的边框。 
inset:3D内嵌边框(颜色较深)。 
outset:3D外嵌边框(颜色较浅)。

如果选择符与元素匹配,那么声明发生作用;如果没有适用的声明,用继承值;如果没有继承值,用默认值。 
标注“!important”的比未标注的级别高; 
作者的样式表单覆盖读者的样式表单,读者的覆盖UA的。 
按选择符的指数来排列。(略) 
按顺序排列,后一个执行的胜出。 

1、绝对长度值:cm,mm,in,pt,pc等。绝对长度值最好用于打印输出设备,而在仅仅作为屏幕显示用绝对长度值并无多大意义。

12、Shadow 语法:filter:Shadow(color=,direction=) 在指定的方向上建立物体的投影。

本文由云顶娱乐官方入口发布于云顶娱乐网址4118112,转载请注明出处:简写方法 {background,用任何不带格式的文本编辑

关键词:

  • 上一篇:没有了
  • 下一篇:没有了