通常情况下CSS的语法包括三个方面:选择符、属性和值,其写法如下:
选择符{属性:属性值;}
需要注意的有以下几点:
属性必须要在{}大括号中。
属性和属性值之间用“:”分隔开。
有多个属性的时候,用“;”进行分隔。
如果一个属性有几个值的时候,每个属性值之间用空格分隔开。
另外,在书写属性的时候,属性之间使用空格、换行等,并不影响属性的显示。
一、选择符
选择符中常用的是通配选择符、ID选择符、类型选择符、包含选择符、类选择符和选择分组。
通配选择符
通配选择符的写法是“*”,其含义就是所有元素。比如:
*{font-size:14px;}
font-size属性是字体的大小,px是像素。该样式实现的效果是,页面中所有文本的字体大小为14个像素。
ID选择符
ID选择符的语法格式是“#”加上自定义的ID名称,比如:
#name{font-size:14px;}
这个样式实现的效果是,在所有调用ID名称为name的页面元素中,文本的字体大小为14个像素。需要说明的是,ID选择符的名称在页面中是唯一的。在页面中定义了ID选择符的名字为name,那么你页面中的其他ID选择符就不能再定义为name。
类型选择符
类型选择符就是以文档语言对象类型作为选择符,即使用结构中元素名称。比如:body、p、div等:
div{font-size:14px;}
这个样式的效果是,在页面中,所有div元素包含的内容,字体大小为14个像素。所有的页面元素都可以作为类型选择符。
包含选择符
包含选择符的写法:选择符1 选择符2。
选择符1和选择符2之间只用空格分隔。含义是所有选择符1中包含选择符2。比如:
div p{font-size:14px;}
这个样式实现的效果是,在所有被div元素包含的p元素中的文本的字体大小是14个像素。
类选择符
类选择符的写法是“.”加上自定义的类名称,比如:
.name{font-size:14px;}
该样式实现的效果是,在所有调用类名称为name的元素中,文本的字体大小是14个像素。类选择符的名称在页面中不是唯一的,可以通过定义相同的类名来调用同一个样式。
选择符分组
当多个选择符应用相同的样式,可以将选择符用英文逗号分隔的方式,合并为一组。写法:选择符1,选择符2,选择符3。
.name,div,p{font-size:14px;}
这样最终的效果是在类名字为name的元素、div元素、p元素中,文本的字体大小是14个像素。
二、属性
属性是CSS中最重要的部分,也是最复杂的部分。其中常用的属性有字体、文本属性、背景属性、尺寸属性、定位属性、布局属性、列表属性、表格属性等。其中某些属性,只有部分浏览器支持,这使得属性的应用变得更复杂。关于属性的知识,以后会慢慢的学习。
link:http://www.tech-ex.com/learning/swdiy/00399780.html
分享到:
相关推荐
CSS选择符详解,内容包括元素选择符... 属性选择符大致可分为四类:简单属性选择符、精准属性值选择符、部分匹配属性值选择符和起始值属性选择符。 简单属性选择符:根据属性选择元素。 Eg:h1[class] {color: silv
}以下是IE7中新支持的属性选择符:精确属性匹配 [=] : 只有当属性完全匹配指定值的时候, 则会应用该css定义.存在匹配 []: 只要存在这样的属性, 则应用该css定义.连字号匹配[|=]: 使用连字号匹配的css定义. 例如: ”en...
属性选择符属性名选择符 格式:标签名[属性名]示例: CSS Code复制内容到剪贴板 img[title] {border:2px solid blue;} 提示:一般来说,人们经常给 alt 和 title 属性设定相同的值。 alt 属性中的文本会在...
}) 属性选择也可以用组合方式: $(‘a[href^=http] [href*=wangorg]’).addClass(‘abold’) 自定义选择符是JQUERY添加的独有的完全不同的选择符,语法与CSS中的伪类选择符语法相同,即选择符以一个冒号(:)开头...
属性选择符 E[att] 选择具有att属性的E元素。 XML/HTML Code复制内容到剪贴板 input[type]{color: #red;}<input type=radio> E[att=val] 选择具有att属性且属性值等于val的E元素。 XML/HTML Code复制...
CSS选择符包括通配选择符、ID选择符、属性选择符、包含选择符、类选择符等,他们的基本格式为: 通配选择符:$(“#ID *”) 表示该元素下的所有元素。 ID选择符:$(“#ID”) 表示获得指定ID的元素。 属性选择符:$...
EPLAN P8 占位符的创建和运用,选择电气图中的相关电路,点击“插入” --------“占位符对象”,在占位符对象属性画面, 填写名称,并在分配画面-------属性-----技术参数后面的变量处填写变量名称。
双向数据绑定原理: 在MDN上对该方法的说明是:Object.defineProperty() 方法会直接在一个对象上定义一个新...然后我们可以通过在存取描述符中的get和set方法内写入自定义的逻辑来实现对象获取属性和设置属性时的行为。
③属性选择符,而上下文选择符的最大好处就是可以方便的实现基于位置为HTML元素添加样式比如我们想位于article和aside标签中的p标签,设置不同的样式 上下文选择符也叫后代组合式选择符,是以空格分隔标签名的,其...
类属性类选择符 格式:.类名示例: CSS Code复制内容到剪贴板 .specialtext {font-style:italic;} 标签带类选择符 格式:标签名.类名示例: CSS Code复制内容到剪贴板 p.specialtext {color:red;} 多类选择...
去年曾总结了《IE对CSS样式表的限制和解决方案》中限制的第4条写道“一个CSS文件的不能超过288kb?...DEMO中的 style.css 有4913个选择符,大小为554kb,但在IE中却在4095个选择符之后失效,所以说明
英文原文:http://www.456bereastreet.com/archive/200601/css_3_selectors_explained/中文翻译:http://www.dudo.org/article.asp?id=197注:本文写于2006年1月,当时IE7、IE8和Firefox3还未发行,文中...在IE8和Fir
jQuery 选择符 CSS选择符, 如: $(‘#title1 > li’)为取得ID为title1(#title)的子元素(>)中所有的列表项(li)。 $(‘#title1 li:not(.class1)’)为取得ID为title的后代元素中没有(not)class1类的所有列表项。 ...
本手册针对的是已有一定网页设计制作经验的读者。其目的是提供最新最全的样式表内容的快速索引及注释。... 3、属性选择符 Attribute Selectors ……………… …… 还有很多其它的内容,恕不描述了。
超链接文字的状态可以通过伪类选择符+样式规则来控制。伪类选择符包括: 总: a 表示所有状态下的连接 如 .mycls a{color:red} ① a:link:未访问链接 ,如 .mycls a:link {color:blue} ② a:visited:已访问链接...