css属性
CSS 背景属性
属性描述
background简写属性,作用是将背景属性设置在一个声明中。background-attachment背景图像是否固定或者随着页面的其余部分滚动。background-color设置元素的背景颜色。
background-image把图像设置为背景。
background-position设置背景图像的起始位置。
background-repeat设置背景图像是否及如何重复。
CSS 文本属性
属性描述
color设置文本颜色
direction设置文本方向。
line-height设置行高。
letter-spacing设置字符间距。
text-align对齐元素中的文本。
text-decoration向文本添加修饰。
text-indent缩进元素中文本的首行。
text-shadow 设置文本阴影。CSS2 包含该属性,但是 CSS2.1 没有保留该属性。
text-transform控制元素中的字母。
unicode-bidi 设置文本方向。
white-space设置元素中空白的处理方式。
word-spacing设置字间距。
设置链接的样式
能够设置链接样式的CSS 属性有很多种(例如color, font-family, background 等等)。
链接的特殊性在于能够根据它们所处的状态来设置它们的样式。
链接的四种状态:
?a:link - 普通的、未被访问的链接
?a:visited - 用户已访问的链接
?a:hover - 鼠标指针位于链接的上方
?a:active - 链接被点击的时刻
CSS Table 属性
属性描述
border-collapse设置是否把表格边框合并为单一的边框。
border-spacing设置分隔单元格边框的距离。
caption-side设置表格标题的位置。
empty-cells设置是否显示表格中的空单元格。
table-layout设置显示单元、行和列的算法。
CSS 边框属性
"CSS" 列中的数字指示哪个 CSS 版本定义了该属性。
属性描述CSS outline在一个声明中设置所有的轮廓属性。 2 outline-color设置轮廓的颜色。 2 outline-style设置轮廓的样式。 2 outline-width设置轮廓的宽度。 2
CSS 尺寸属性
CSS 尺寸属性允许你控制元素的高度和宽度。同样,还允许你增加行间距。
属性描述
height设置元素的高度。
line-height设置行高。
max-height设置元素的最大高度。
max-width设置元素的最大宽度。
min-height设置元素的最小高度。
min-width设置元素的最小宽度。
width设置元素的宽度。
CSS 分类属性 (Classification)
CSS 分类属性允许你控制如何显示元素,设置图像显示于另一元素中的何处,相对于其正常位置来定位元素,使用绝对值来定位元素,以及元素的可见度。
属性描述
clear设置一个元素的侧面是否允许其他的浮动元素。
cursor规定当指向某元素之上时显示的指针类型。
display设置是否及如何显示元素。
float定义元素在哪个方向浮动。
position把元素放置到一个静态的、相对的、绝对的、或固定的位置中。visibility设置元素是否可见或不可见。
导航栏 = 链接列表
导航栏需要标准的 HTML 作为基础。
在我们的例子中,将用标准的 HTML 列表来构建导航栏。
导航栏基本上是一个链接列表,因此使用
- 和
- 元素是非常合适的:opacity 属性设置元素的不透明级别。
默认值: 1
继承性:no
版本:CSS3
JavaScript 语法:object.style.opacity=0.5
语法
opacity: value|inherit;
值描述测试
value 规定不透明度。从 0.0 (完全透明)到 1.0(完
全不透明)。
测试
inherit 应该从父元素继承 opacity 属性的值。
Content for Paged Media 属性
属性描述CSS bookmark-label 规定书签的标记。 3 bookmark-level 规定书签的级别。 3 bookmark-target 规定书签链接的目标。 3 float-offset 将元素放在 float 属性通常放置的位置的相反方向。3 hyphenate-after 规定连字单词中连字符之后的最小字符数。 3 hyphenate-before 规定连字单词中连字符之前的最小字符数。 3 hyphenate-character 规定当发生断字时显示的字符串。 3 hyphenate-lines 指示元素中连续断字连线的最大数。 3 hyphenate-resource 规定帮助浏览器确定断字点的外部资源(逗号分隔的3
列表)。
hyphens 设置如何对单词进行拆分,以改善段落的布局。 3 image-resolution 规定图像的正确分辨率。 3 marks 向文档添加裁切标记或十字标记。 3 string-set
Box 属性
属性描述CSS
overflow-x 如果内容溢出了元素内容区域,是否对内容的左/右边缘进
行裁剪。
3
overflow-y 如果内容溢出了元素内容区域,是否对内容的上/下边缘进
行裁剪。
3
overflow-style规定溢出元素的首选滚动方法。 3 rotation围绕由 rotation-point 属性定义的点对元素进行旋转。 3 rotation-point定义距离上左边框边缘的偏移点。
可伸缩框属性(Flexible Box)
属性描述CSS box-align规定如何对齐框的子元素。 3 box-direction规定框的子元素的显示方向。 3 box-flex规定框的子元素是否可伸缩。 3 box-flex-group将可伸缩元素分配到柔性分组。 3 box-lines规定当超出父元素框的空间时,是否换行显示。 3 box-ordinal-group规定框的子元素的显示次序。 3 box-orient规定框的子元素是否应水平或垂直排列。 3 box-pack规定水平框中的水平位置或者垂直框中的垂直位置。
内容生成(Generated Content)
属性描述CSS
content 与 :before 以及 :after 伪元素配合使用,来插入生成
内容。
2
counter-increment递增或递减一个或多个计数器。 2 counter-reset创建或重置一个或多个计数器。 2 quotes设置嵌套引用的引号类型。 2
crop 允许被替换元素仅仅是对象的矩形区域,而不是整个对象。
3
move-to 从流中删除元素,然后在文档中后面的点上重新插入。 3 page-policy 确定元素基于页面的 occurrence 应用于计数器还是字符串
Grid 属性
属性描述CSS grid-columns规定网格中每个列的宽度。 3 grid-rows规定网格中每个列的高度。 3
Hyperlink 属性
属性描述CSS
target 简写属性,设置target-name、target-new以及target-position属性。
3
target-name规定在何处打开链接(链接的目标)。 3
target-new 规定目标链接在新窗口还是在已有窗口的新标签页中打开。
3
target-position规定在何处放置新的目标链接。 3
Marquee 属性
属性描述CSS marquee-direction 设置移动内容的方向。 3 marquee-play-count 设置内容移动多少次。 3 marquee-speed 设置内容滚动得多快。 3 marquee-style 设置移动内容的样式。 3
多列属性(Multi-column)
属性描述CSS column-count规定元素应该被分隔的列数。 3 column-fill规定如何填充列。 3 column-gap规定列之间的间隔。 3 column-rule设置所有 column-rule-* 属性的简写属性。 3 column-rule-color规定列之间规则的颜色。 3 column-rule-style规定列之间规则的样式。 3 column-rule-width规定列之间规则的宽度。 3 column-span规定元素应该横跨的列数。 3 column-width规定列的宽度。 3
columns 规定设置 column-width 和 column-count 的简写属性。
3
CSS 定位属性(Positioning)
属性描述CSS bottom设置定位元素下外边距边界与其包含块下边界之间的偏移。2 clear规定元素的哪一侧不允许其他浮动元素。 1 clip剪裁绝对定位元素。 2 cursor规定要显示的光标的类型(形状)。 2 display规定元素应该生成的框的类型。 1 float规定框是否应该浮动。 1 left设置定位元素左外边距边界与其包含块左边界之间的偏移。2 overflow规定当内容溢出元素框时发生的事情。 2 position规定元素的定位类型。 2 right设置定位元素右外边距边界与其包含块右边界之间的偏移。2
top 设置定位元素的上外边距边界与其包含块上边界之间的偏移。
2
vertical-align设置元素的垂直对齐方式。 1 visibility规定元素是否可见。 2
z-index设置元素的堆叠顺序。
CSS 文本属性(Text)
属性描述CSS color设置文本的颜色。 1 direction规定文本的方向 / 书写方向。 2 letter-spacing设置字符间距。 1 line-height设置行高。 1 text-align规定文本的水平对齐方式。 1 text-decoration规定添加到文本的装饰效果。 1 text-indent规定文本块首行的缩进。 1 text-shadow 规定添加到文本的阴影效果。 2 text-transform控制文本的大小写。 1 unicode-bidi设置文本方向。 2 white-space规定如何处理元素中的空白。 1 word-spacing设置单词间距。 1 hanging-punctuation规定标点字符是否位于线框之外。 3 punctuation-trim规定是否对标点字符进行修剪。 3
text-align-last 设置如何对齐最后一行或紧挨着强制换行符之前的行。
3
text-emphasis向元素的文本应用重点标记以及重点标记的前景色。 3
text-justify 规定当 text-align 设置为 "justify" 时所使用的
对齐方法。
3
text-outline规定文本的轮廓。 3 text-overflow规定当文本溢出包含元素时发生的事情。 3
text-shadow向文本添加阴影。 3 text-wrap规定文本的换行规则。 3 word-break规定非中日韩文本的换行规则。 3
word-wrap 允许对长的不可分割的单词进行分割并换行到下一行。
3
过渡属性(Transition)
属性描述CSS
transition 简写属性,用于在一个属性中设置四个过渡属性。
3
transition-property规定应用过渡的 CSS 属性的名称。 3 transition-duration定义过渡效果花费的时间。 3 transition-timing-function规定过渡效果的时间曲线。 3 transition-delay规定过渡效果何时开始。 3
用户界面属性(User-interface)
属性描述CSS appearance允许您将元素设置为标准用户界面元素的外观 3 box-sizing允许您以确切的方式定义适应某个区域的具体内容。 3 icon为创作者提供使用图标化等价物来设置元素样式的能力。3 nav-down规定在使用 arrow-down 导航键时向何处导航。 3 nav-index设置元素的 tab 键控制次序。 3 nav-left规定在使用 arrow-left 导航键时向何处导航。 3 nav-right规定在使用 arrow-right 导航键时向何处导航。 3 nav-up规定在使用 arrow-up 导航键时向何处导航。 3 outline-offset对轮廓进行偏移,并在超出边框边缘的位置绘制轮廓。 3 resize规定是否可由用户对元素的尺寸进行调整。 3
CSS3 选择器
在 CSS 中,选择器是一种模式,用于选择需要添加样式的元素。
"CSS" 列指示该属性是在哪个 CSS 版本中定义的。(CSS1、CSS2 还是 CSS3。)
选择器例子例子描述CSS
.class.intro 选择 class="intro" 的所
有元素。
1
#id#firstname 选择id="firstname" 的
所有元素。
1
** 选择所有元素。 2 element p 选择所有
元素。 1
element,element div,p 选择所有
元素和所有
元素。
1
element element div p 选择
元素内部的所有
元素。
1
element>element div>p 选择父元素为
元素的所有
元素。
2
element+element div+p 选择紧接在
元素之后的所有
元素。
2
[attribute][target] 选择带有 target 属性所
有元素。
2
[attribute=value][target=_blank] 选择target="_blank" 的
所有元素。
2
[attribute~=value][title~=flower] 选择 title 属性包含单词"flower" 的所有元素。
2
[attribute|=value][lang|=en] 选择 lang 属性值以 "en" 开头的所有元素。
2
:link a:link 选择所有未被访问的链接。1 :visited a:visited 选择所有已被访问的链接。1 :active a:active 选择活动链接。 1
:hover a:hover 选择鼠标指针位于其上的
链接。
1
:focus input:focus 选择获得焦点的 input 元素。
2
:first-letter p:first-letter 选择每个
元素的首字母。
1
:first-line p:first-line 选择每个
元素的首行。
1
:first-child p:first-child 选择属于父元素的第一个
子元素的每个
元素。
2
:before p:before 在每个
元素的内容之
前插入内容。
2
:after p:after 在每个
元素的内容之
后插入内容。
2
:lang(language)p:lang(it) 选择带有以 "it" 开头的lang 属性值的每个
元素。
2
element1~element2p~ul 选择前面有
元素的每
个
- 元素。
3
[attribute^=value]a[src^="https"] 选择其src 属性值以"https" 开头的每个
3
[attribute $=value ] a[src$=".pdf"] 选择其 src 属性以
".pdf" 结尾的所有 元素。
3
[attribute *=value ] a[src*="abc"] 选择其 src 属性中包含
"abc" 子串的每个 元素。
3
:first-of-type p:first-of-type 选择属于其父元素的首个
元素的每个
元素。
3
:last-of-type p:last-of-type 选择属于其父元素的最后
元素的每个
元素。
3
:only-of-type p:only-of-type 选择属于其父元素唯一的
元素的每个
元素。
3
:only-child p:only-child 选择属于其父元素的唯一
子元素的每个
元素。 3
:nth-child(n ) p:nth-child(2) 选择属于其父元素的第二
个子元素的每个
元素。
3
:nth-last-child(n ) p:nth-last-child(2) 同上,从最后一个子元素开
始计数。
3
:nth-of-type(n ) p:nth-of-type(2) 选择属于其父元素第二个
元素的每个
元素。
3
:nth-last-of-type(n ) p:nth-last-of-type(2) 同上,但是从最后一个子元
素开始计数。
3
:last-child p:last-child 选择属于其父元素最后一
个子元素每个
元素。
3
:root :root 选择文档的根元素。 3
:empty p:empty 选择没有子元素的每个
元素(包括文本节点)。 3
:target #news:target 选择当前活动的 #news 元
素。
3
:enabled input:enabled 选择每个启用的
元素。
3
:disabled input:disabled 选择每个禁用的
元素
3
:checked input:checked 选择每个被选中的
元素。
3
:not(selector ) :not(p) 选择非
元素的每个元3
选择被用户选取的元素部分。3
::selection::selection
CSS_style属性大全
CSS style属性大全 显示: 标签属性/属性行为集合事件滤镜方法对象样式 一、标签属性属性描述 ALIGN align 设置或获取表格排列。 ALLOWTRANSPARENCY allowTransparency 设置或获取对象是否可为透明。 APPLICATION APPLICATION 表明对象的内容是否为HTML 应用程序(HTA),以便免除浏览器安全模式。ATOMICSELECTION 指定元素及其内容是否可以一不可见单位统一选择。 BEGIN begin 设置或获取时间线在该元素上播放前的延迟时间。 BORDER border 设置或获取框架间的空间,包括3D 边框。 canHaveChildren 获取表明对象是否可以包含子对象的值。 canHaveHTML 获取表明对象是否可以包含丰富的HTML 标签的值。 CLASS className 设置或获取对象的类。 contentWindow 获取指定的frame 或iframe 的window 对象。 DA TAFLD dataFld 设置或获取由dataSrc 属性指定的绑定到指定对象的给定数据源的字段。 DA TASRC dataSrc 设置或获取用于数据绑定的数据源。 disabled 获取表明用户是否可与该对象交互的值。 END end 设置或获取表明元素结束时间的值,或者元素设置为重复的简单持续终止时间。 firstChild 获取对象的childNodes 集合的第一个子对象的引用。 FRAMEBORDER frameBorder 设置或获取是否显示框架的边框。 hasMedia 获取一个表明元素是否为HTML+TIME 媒体元素的Boolean 值。 HEIGHT height 设置或获取对象的高度。 HIDEFOCUS hideFocus 设置或获取表明对象是否显式标明焦点的值。 HSPACE hspace 设置或获取对象的水平边距。 ID id 获取标识对象的字符串。 innerText 设置或获取位于对象起始和结束标签内的文本。 isContentEditable 获取表明用户是否可编辑对象内容的值。 isDisabled 获取表明用户是否可与该对象交互的值。 isMultiLine 获取表明对象的内容是包含一行还是多行的值。 isTextEdit 获取是否可使用该对象创建一个TextRange 对象。 LANG lang 设置或获取要使用的语言。 LANGUAGE language 设置或获取当前脚本编写用的语言。
HTML+CSS标签属性大全
HTML CSS标签属性大全 a卷标, 属性名称, 简介 批注 1、跑马灯 普通卷动 滑动 预设卷动 来回卷动 向下卷动 向上卷动 向右卷动 向左卷动 卷动次数 设定宽度 设定高度 设定背景颜色 设定卷动距离 设定卷动时间 2、字体效果
…
标题字(最大)…
标题字(最小) …粗体字 …粗体字(强调) …斜体字 …斜体字(强调) …斜体字(表示定义) …底线 …底线(表示插入文字)…横线…删除线…删除线(表示删除) …键盘文字 … 打字体… 固定宽度字体(在文件中空白、换行、定位功能有效)… 固定宽度字体(不执行标记符号)… 固定宽度小字体 …字体颜色 …最小字体 …无限增大 3、区断标记
水平线
水平线(设定大小)
水平线(设定宽度)
水平线(设定颜色)
(换行)… 水域(不换行)CSS属性代码大全
CSS属性代码大全 一、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; /*文字垂直向下对齐*/ 二、CSS边框空白: padding-top:10px; /*上边框留空白*/ padding-right:10px; /*右边框留空白*/ padding-bottom:10px; /*下边框留空白*/ padding-left:10px; /*左边框留空白 三、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; /*实心圆形符号*/
常用CSS样式属性CSS样式表
常用CSS样式属性|CSS 样式表 【长度单位】 【颜色表示】 CSS可用颜色表示方式 表示方式表示方式说明范例 #rrggbb 可以用Windows色彩选择工具找到color:#feefc7 rgb( #,#,#) 用数字来表示红色蓝色以及绿色的混合色 彩选择工具找...也可以用Windows color:rgb(135,255,1 24) rgb(%,%,%) 用百分比来代表红色蓝色以及绿色的强度来混合颜色color:rgb(70%,35%,4 1%) 颜色名称用颜色的名称来指定颜色color:brown
【属性可用值】 CSS 可用属性值 名称 说明 可能值 范例 visibility 显示或是隐藏 inherit ( 父组件决定) hidden (隐藏) visible ( 显示) visibili ty:hidde n width 宽度 auto (自动决定) 数字 width:13 5 height 高度 auto (自动决定) 数字 height:1 00 z-index Z 轴高度(立体,是否在 另一个组件之上) auto (自动决定) 数字 z-index: 135 position 定位方式 absolute (绝对寻址-依窗口坐标,原点为父窗口左上角 ) relative (相对定位-以一般网页排列[后再根据坐标定位, 原点为定位后的位置) static (静态定位-以一般网页排列) position :absolut e top (对象的position 属 性须为absolute 或 relative ) 对象的Y 坐标(原点根 据postion 属性有所不 同) 数字 left (对象的 position 属性须为absolute 或 relative ) 对象的X 坐标(原点根 据postion 属性有所不 同) 数字
css样式大全(精华版)
字体属性:(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 背景属性:(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;} /*简写·这个在阅读代码中经常出现,要认真的研究*/ 区块属性:(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;(不换行)
css样式大全(整理版)
css样式大全(整理版) 字体属性:(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 背景属性:(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;} /*简写·这个在阅读代码中经常出现,要认真的研究*/ 区块属性:(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; 数值
CSS3常用属性大全
CSS3 动画属性(Animation) @keyframes //规定动画。 animation //所有动画属性的简写属性,除了animation-play-state 属性。animation-name //规定@keyframes 动画的名称。 animation-duration //规定动画完成一个周期所花费的秒或毫秒。 animation-timing-function //规定动画的速度曲线。 animation-delay //规定动画何时开始。 animation-iteration-count //规定动画被播放的次数。 animation-direction //规定动画是否在下一周期逆向地播放。 animation-play-state //规定动画是否正在运行或暂停。 animation-fill-mode //规定对象动画时间之外的状态。 CSS 背景属性(Background) background //在一个声明中设置所有的背景属性。 background-attachment //设置背景图像是否固定或者随着页面的其余部分滚动。background-color //设置元素的背景颜色。 background-image //设置元素的背景图像。 background-position //设置背景图像的开始位置。 background-repeat //设置是否及如何重复背景图像。 background-clip //规定背景的绘制区域。 background-origin //规定背景图片的定位区域。 background-size //规定背景图片的尺寸。 CSS 边框属性(Border 和Outline) border //在一个声明中设置所有的边框属性。 border-bottom //在一个声明中设置所有的下边框属性。 border-bottom-color //设置下边框的颜色。 border-bottom-style //设置下边框的样式。 border-bottom-width //设置下边框的宽度。
css知识点汇总
CSS学习知识点 1、css是什么? CSS(Cascading Style Sheet)可译为“层叠样式表”或“级联样式表”,它定义如何显示 HTML元素,用于控制网页的外观。 2、为什么使用css,优点是什么? 1:【内容】和【表现】相分离 HTML文件中只存放文本信息,将样式部分放在一个独立样式文件中。页面对搜索引擎更加友好。 2:提高页面浏览速度 采用CSS布局的页面容量要比TABLE布局的页面文件容量小得多,前者一般只有后者的1/2大小。 3:易于维护和改版 只要简单的修改对应CSS文件,就可以重新设计整个网站的页面。 4: 使用CSS布局更符合现在的W3C标准 W3C组织是对网络标准制定的一个非赢利组织,像HTML、CSS、XML的标准就是由它来定制。 3、CSS样式表的调用方式哪几种? 1、内部样式:把CSS样式表放到
文档中: 格式如下: 2、内联式:把CSS样式表写在HTML对应的标记内。 格式如下:蓝色14号文字 3、外部样式:把编辑好的CSS文档保存成“.CSS”文件,然后在
中定义。 格式如下: ..... 4、导入样式:与链入外部样式的功能基本相同,只是语法和实现方式上有差别。 格式如下: 4、几种调用方式的优先级? 从高到低:内联样式--------外部样式---------内部样式-----------导入样式 5、CSS的语法: CSS的定义是由三部分构成: 选择器,属性和属性值。 语法: selector {property: value;} --------------------- 选择符{属性:值}CSS中的各属性意思
1、字体属性 这是最基本的属性,您经常都会用到。它主要包括以下这些属性: 2、颜色和背景属性 下面我们就讲一下CSS的颜色和背景属性。先来看一下CSS下的颜色和背景都有哪些属性吧(如下表): 3、文本属性 ※定义间距 前面说了如何用CSS定义字体、颜色和背景属性,那么定义好的文本我们怎么对它进行排版呢? 下面我们讲述一下CSS的文本属性,还是先来看一下文本属性的详细列表:
※装饰超链接 网页默认的链接方式是这样的:未访问过的链接是蓝色文字并带蓝色的下划线,访问过的超级链接是深紫色的文字并带深紫色的下划线。如果您所有的网页都是这种样式,是不是很单调呢? 4、“容器”属性 ※边距属性 听起来是不是很有趣,什么叫“容器”属性呢?CSS的容器属性包括边距、填充距、边框和宽度、高度、浮动、清除等属性。 您想,网页中的内容肯定是都需要“装”进这个“容器”里。“容器”属性是CSS中非常重要的一种属性,我们将分类进行学习。 先来看一下边距属性的详细列表: ※填充距属性 本节我将向您介绍填充距属性。我们先来看一下填充距的属性列表: ※边框属性 本节我们来看一下种类繁多的边框属性,先来看一下属性列表:
※图文混排 我们在来看看“容器”属性还有什么其他的属性,请看属性列表: 5、分级属性 如果您使用过Word,那您一定知道Word中有一个“项目符号和编号”的功能。 在html中,您无需使用前面提到的一些字体、颜色、容器属性来对字体、颜色和边距、填充距等进行初始化。因为在CSS中,已经提供了进行分级的专用分级属性。 分级属性包括了“list-style”(列表样式)、“list-item”(列表项)等多种属性,我们先来看一下分级属性的详细列表: 6、鼠标属性
CSS属性大全完整版
CSS属性大全完整版 字体属性:(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 背景属性:(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; 区块属性:(Block) 字间距 letter-spacing: normal; 数值 对齐 text-align: justify; (两端对齐) left; (左对齐) right; (右对齐) center; (居中) 缩进
css常用的属性大全
CSS常用属性大全 2011-04-22 12:51 字体属性:(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;(闪烁) 字体投影效果:filter:dropshadow(color=#FFFFFF, offx=1, offy=1, positive=1); 背景属性: (background) 色彩background-color: #FFFFFF; 图片background-image: url(); 重复background-repeat: repeat; no-repeat; repeat-x; repeat-y;滚动background-attachment: fixed;(固定) scroll;(滚动) 位置background-position: left(水平) top(垂直);bottom; right; center; 简写方法 background:#000 url(..) repeat fixed left top; 区块属性: (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;(不换行)
css属性列表 和 属性值含义
css属性列表和属性值含义css属性列表 属性名称 字体属性(Font) font-family font-style font-variant font-weight font-size 颜色和背景属性 Color Background-color Background-image Background-repeat Background-attachment Background-position 文本属性 Word-spacing Letter-spacing Text-decoration Vertical-align Text-transform Text-align Text-indent Line-height 边距属性 Margin-top Margin-right Margin-bottom Margin-left Margin 属性含义 使用什么字体 字体是否斜体 是否用小体大 写 字体的粗细 字体的大小 定义前景色 定义背景色 定义背景图案 重复方式 设置滚动 初始位置 单词之间的间 距 字母之间的间 距 文字的装饰样 式 垂直方向的位 置 文本转换 对齐方式 首行的缩进方 式 文本的行高 分别设置上右 下左,一个值 属性值 所有的字体 Normal、italic、oblique Normal、small-caps Normal、bold、bolder、lithter等 Absolute-size、relative-size、length、 percentage等 颜色 颜色 路径 Repeat-x、repeat-y、no-repeat Scroll、Fixed Percentage、length、top、left、 right、bottom等 Normal
同上 None|underline|overline|line- through|blink Baseline|sub|super|top|text-top|middl e|bottom|text-bottom| Capitalize|uppercase| lowercase|none Left|right|center|justify | Normal| | | Length|percentage|auto 同上 同上 同上 css属性大全
字体属性:(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 背景属性:(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; 区块属性:(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;(表格标题) 方框属性:(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; 列表属性:(List-style) 类型list-style-type: disc;(圆点) circle;(圆圈) square;(方块) decimal;(数字) lower-roman;(小罗码数字) upper-roman; lower-alpha; upper-alpha;
css属性(功能分类)
css属性(功能分类)
CSS3 动画属性(Animation) 属性描述CSS @keyframes规定动画。 3 animation所有动画属性的简写属性,除了 animation-play-state 3 属性。 animation-name规定 @keyframes 动画的名称。 3 animation-duration规定动画完成一个周期所花费的秒或毫秒。 3 animation-timing-function规定动画的速度曲线。 3 animation-delay规定动画何时开始。 3 animation-iteration-count规定动画被播放的次数。 3 animation-direction规定动画是否在下一周期逆向地播放。 3 animation-play-state规定动画是否正在运行或暂停。 3 animation-fill-mode规定对象动画时间之外的状态。 3 CSS 背景属性(Background) 属性描述CSS background在一个声明中设置所有的背景属性。 1 background-attachment设置背景图像是否固定或者随着页面的其余部分滚动。 1 background-color设置元素的背景颜色。 1 background-image设置元素的背景图像。 1 background-position设置背景图像的开始位置。 1 background-repeat设置是否及如何重复背景图像。 1 background-clip规定背景的绘制区域。 3 background-origin规定背景图片的定位区域。 3 background-size规定背景图片的尺寸。 3 CSS 边框属性(Border 和Outline) 属性描述CSS border在一个声明中设置所有的边框属性。 1 border-bottom在一个声明中设置所有的下边框属性。 1 border-bottom-color设置下边框的颜色。 2
HTML中CSS样式标签大全及用法
CSS 网页样式大全如下: 字体属性:(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 背景属性:(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; 区块属性:(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;(表格标题) 方框属性:(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; 列表属性:(List-style)
CSS常用属性大全
css 常 用属性 CSS 文字属性: color : #999999; /* 文字颜色 */ font-family : 宋体,sans-serif; /* 文字字体 */ fon t-varia nt:small-ca ps; /* letter-s pacing : 1pt; /* text-alig n:left; /* 文字左对齐*/ text-alig n:cen ter; /* 文字居中对齐*/ text-alig n:justify; /* 文字分散对齐*/ vertical-alig n 属性 fon t-size : 9pt; /* 文字大小*/ fon t-style:itelic; /* 文字斜体*/ lin e-height : 200%; /* 设置行高*/ fon t-weight:bold; /* 文字粗体*/ vertical-alig n: sub; /* 下标字*/ vertical-alig n:super; /* 上标字*/ text-decorati on :li ne-through; /* 加删除线*/ text-decorati on: overli ne; /* 加顶线*/ text-decorati on:un derl ine; /* 加下划线*/ text-decorati on:none; /* 删除链接下划线*/ text-tra nsform : cap italize; /* 首字大写*/ text-tra nsform : upp ercase; /* 英文大写*/ text-tra nsform : lowercase; /* 英文小写*/ text-alig n:r ight; /* 文字右对齐 */ 小字体*/ 字间距离*/
css代码大全
css属性代码大全 一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; /*文字垂直向下对齐*/ 二、CSS边框空白 padding-top:10px; /*上边框留空白*/ padding-right:10px; /*右边框留空白*/ padding-bottom:10px; /*下边框留空白*/
相关主题