css权威指南--笔记

第1章 css和文档

1,元素:替换元素(img input),非替换元素(大多数span)。

2,link:rel(代表关系:stylesheet,候选样式表:alternate stylesheet);type(text/css);media:(all(所有表现媒体, screen,print),title(配合候选使用)。

3,@import url(sheet1.css) 需在style内使用,放在其他css规则之前。

4,向后可访问性:<style><!-- 样式 --></style>,这样较老浏览器会将style忽略,能理解css的浏览器能正常读取样式表。

5,css注释:/* */。

第2章 选择器

1,对声明分组时,一定要在各个声明的最后使用分号。

2,p.warming.help {background:red;} 只匹配class包含warming和help的p元素,如果p包含warming和其他的则不能匹配。

3,实际上,浏览器并不检查html中id的唯一性,但这会导致编写dom更困难。

4,属性选择器:h1[class] {...}

h1[class=‘‘] {...}完全匹配

h1[class~=‘‘] {...}部分匹配 [class^=‘‘]以什么开头 [class$=‘‘]以什么结尾 [class*=‘‘]包含什么的所有元素

*[lang|=‘en‘]特定属性选择器,会选择lang属性等于en或以en-开头的所有元素。

5,选择子元素:h1>strong;选择相邻兄弟元素h1+p(h1和p有共同父元素,最终选择p)。

6,链接伪类:未访问链接:link,访问过链接:visited(它们都是静态的),等同于<body link=‘‘ vlink=‘‘>。

动态伪类:焦点:focus,鼠标停留:hover,激活:active。(动态伪类可以用于任何元素)

建议伪类顺序:link-visited-focus-hover-active。

选择第一个子元素(:first-child),很容易误解,是所有第一个子元素(在下面例子中,作为第一个子元素的元素包括第一个p,第一个li和strong及em)。

 1 <div>
 2     <p>helooo</p>
 3     <ul>
 4         <li>111</li>
 5         <li><strong>222</strong></li>
 6     </ul>
 7     <p>
 8         <em>333</em>
 9     </p>
10 </div>

根据语言选择(:lang()),如*:lang(fr){color:red;} 这是将所有法语元素变成红色。

伪元素选择器:首字母:first-letter,用户代理动态构成假象元素<p:first-letter>;

第一行:first-line;

之前和之后:before :after。

时间: 2024-10-13 08:26:51

css权威指南--笔记的相关文章

css 权威指南笔记

部分属性选择: 选择class 属性中包含warning的元素 [class~="warning"]{font-weight:bold} 子串匹配属性选择器: 在现代浏览器中得到支持 包括ie7 特定属性选择器: css 权威指南笔记

css 权威指南笔记( 五)结构和层叠之三种样式来源

CSS中的样式一共有三种来源:创作人员.读者和用户代理,来源的不同会影响到样式的层叠方式 首先,创作人员(author's+style)样式应该是我们最熟悉的,如果你是一个前端开发者,那么你写的那些样式就叫做创作人员样式. 然后是用户代理样式(agent's+style),用户代理也就是我们通常所说的浏览器(IE.Firefox等等),这些浏览器会提供一些默认的样式,比如IE浏览器中,一个纯粹由html代码构成的网页里,我们会发现超链接会带有一个蓝色的前景色,这其实就用户代理样式,借用一些插件我

css权威指南笔记(知识点总结)

第一章 css和文档 ?1.替换元素与非替换元素,替换元素如 img input等,大多数html元素都是非替换元素. 2.块级元素和行内元素?,块级元素会自动填满父级元素的内容框,表格与其他块级元素一致,唯一有区别的是表格会生成一个标记符,就是小黑点.在html中块级元素不能继承行内元素,也就是说块级元素不能嵌套在行内元素里面,但是css中块级元素能继承行内元素的样式. 3.link里面包含以下几个属性,rel:来源:href:路径:media:默认为all(一般浏览器支持all.print.

css权威指南笔记

替换元素和非替换元素 替换元素:用来替换元素内容的部分并非由文档内容直接表示,用作其他内容的占位符(img, 表单元素,embed等嵌入元素) 非替换元素:元素的内容内容包含在文档流中,大部分元素都是替换元素. 替换元素和非替换行内元素的区别:替换元素可以设置width.height.margin和padding:非替换行内元素不可以设置width.heigt.垂直margin和padding,可以设置水平margin和padding. 2. 候选样式表 将link标签的rel属性设置为alte

css 权威指南笔记( 五)结构和层叠

特殊性

css 权威指南笔记(二)元素

替换元素 用来替换元素内容的部分并非有文档内容直接表示. img input 非替换元素 其内容由用户代理(通常是一个浏览器)在元素本身生成的框中显示. 块级元素 块级元素生成一个 元素框,(默认)会填充父元素的内容区,旁边不能有其他元素,换句话说,他在元素前后生成分隔符.替换元素可以是块级元素,不过通常都不是. 行内元素 行内元素在一个文本行内生成元素框,而不会打断这行文本.可以出现在另一个元素的内容中,而不会破坏其显示. 块级元素行内元素图文 在HTML和XHTML中,块级元素不能继承自行内

css 权威指南笔记(三)结合css和XHTML

link rel stylesheet alternate stylesheet(候选样式表) title type media all screen print ..... 内联样式

css 权威指南笔记(四)选择器

规则结构 每个规则都有两个基本部分组成:选择器和声明块.声明块由一个或多个声明组成,每个声明则是一个属性-值对. 元素选择器 声明和关键字 关键字一般由空格隔开:有一种情况例外 font属性中的  斜线(/)分割 元素的字体大小和行高两个关键字. 分组 选择器分组 通配选择器 (*)css2引入 声明分组 各个声明最后使用分号: 类选择器和ID选择器 类选择器 多类选择器 各个词之间用空格分隔 不同平台的Internet Explorer 处理不同 ID选择器 属性选择器 简单属性选择器   h

CSS权威指南学习笔记系列(1)CSS和文档

题外话:HTML是一种结构化语言,而CSS是它的补充:这是一种样式语言.CSS是前端三板斧之一,因此学习CSS很重要.而我还是菜鸟,所以需要加强学习CSS.这个是我学习CSS权威指南的笔记,如有不对,请谅解和指出.谢谢大家.正文: 第一章 CSS和文档---------- 1.CSS,称为层叠样式表.使用CSS的理由有:a.易于使用,样式表能大大减少Web创作人员的工作量:b.在多个页面上使用样式,可以创建一个样式表,然后把这个样式表应用到多个页面:c.层叠,CSS还规定了冲突规则:这些规则统称