CSS基本语法与核心概念 - CSS基本知识 - 第2课
本节课时长14分54秒,下载文件11.9兆字节。下载的视频文件为FLV格式,推荐使用“Riva Flv Player”软件播放,点击这里下载。
上一课对CSS如何引入HTML页面进行了介绍,本课重点介绍CSS如何控制页面中的各个标记。从控制HTML标记的不同方法入手,介绍各种选择器的概念,以及选择器的声明等,最后介绍CSS继承在实际设计中的运用。
CSS选择器
选择器(selector)是CSS中很重要的概念,所有HTML语言中的标记都是通过不同的CSS选择器进行控制的。用户只需要通过选择器对不同的HTML标签进行控制,并赋予各种样式声明,即可实现各种效果。希望大家能够掌握以下几个方面的内容:
- 标记选择器
- 类别选择器
- ID选择器
选择器声明
在利用CSS选择器控制HTML标记时,除了每个选择器的属性可以一次声明多个,选择器本身也可以同时声明多个,并且任何形式的选择器包括标记选择器、class类别选择器、ID选择器等都是合法的。我们在这里主要介绍选择器集体声明的各种方法,以及选择器之间的嵌套关系。希望大家能够掌握以下两个方面的内容:
- 集体声明
- 选择器的嵌套
的继承
学习过面向对象语言的用户,对于继承(Inheritance)的概念一定不会陌生。在CSS语言中继承并没有C++、Java等语言中的那么复杂,简单的说就是将各个HTML标记看作一个个容器,其中被包含的小容器会继承所包含它的大容器的风格样式。我们在这里从页面各个标记的父子关系出发,详细的讲解CSS的继承。希望大家能够掌握以下两个方面的内容:
- 父子关系
- CSS继承的运用




Thanks for your blog post. Things i would like to add is that computer system memory has to be purchased but if your computer still can鈥檛 cope with anything you do along with it. One can deploy two RAM memory boards containing 1GB each, as an example, but not one of 1GB and one having 2GB. One should make sure the company鈥檚 documentation for the PC to make certain what type of storage is needed.
不错,学习了!!!!!!!!!!!
[…] 第2课 CSS基本语法与核心概念 […]
请问您能看得出什么意思么,如果看不出请通过如何,不要翻译拉!
I鈥檝e bookmarked, Dugg, and I joined the RSS subscription. Thanks!
http://799043689.taobao.com/ 夏季女装
怎么到了第3课就下载不了后面的了呢?
怎么不不能看了?
您好,
我这里看着没有问题,速度很快。您再试试看?
老师,谢谢你的讲解,开始入门了!
太简单了吧
第二课到7:11(即7分11秒)的时候,后面的视频不播放了。不知道为什么。
还不错啊。。。。。。。。。
这个教程讲得太好了
第一讲,讲的很好~顶个
这教程太棒啦,我的站现在看着吓人,学好div+css可以改得简洁些,更方便!
太棒了,这下我终于可以告别table了!
我买了CSS设计彻底研究这本书,想和视频一起看学习的,可是你这里的教程打不开呀,只有基础知识第一课能打开看,想重新看一次的时候,又打不开看了?
您好 问下
type=text/css 或 type=/ 这个是什么? 加不加有什么区别?
type=text/css 表示类型是CSS文档,type=/ 就是没指定,对于一般的浏览器来说,都能自动识别,写不写都没多大关系。
讲得很好
讲得很好,学习一下,对自己做网站很有帮助
谢了,网站做的很好。
sam,
谢谢您的鼓励!欢迎常来这里交流!
请问 ID的目的就是要选择页面中唯一的元素。
是不是就是指一个页面中只能使用一个ID元素啊
可以列举几个例子吗
谢谢
Somuns ,
应该说:同一个ID在一个页面中出现一次。
请问:
我用的是 Flash 8.0
你们的Riva FLV Player 我也下载了,视频怎么 不能 播放啊?
谢谢
小洋人,
可以到网上找一找任何能够播放 .flv 格式视频的播放软件爱你都可以,比如“风雷影音”,这个不错。
想问下怎么不能下啊,
只下了一个,下完了就不能下了,,,
xudong ,
您现在再试试看,如果下不了,可能是你使用了一些特殊的下载工具,会大量发出下载命令。
我们之所以对下载采取一些限制措施的原因: http://learning.artech.cn/20090410.thinking-on-site-load.html
chance,第二课第6个页面里面的CSS代码:
h2.special, .special, #one{ /* 集体声明 */
text-decoration:underline; /* 下划线 */
h2.special 这个是标记选择器吗?
.special 这个是类别选择器
蜥蜴 ,
名称不重要,重要的事你知道他们分别选中了那些元素即可。
h2.special 可以被称为复合选择器。
请问老师,在使用id选择器时,如果定义好一个ID选择器后想要把该ID选择器应用的多个DIV上,此时,就会与中要求ID具有唯一性的规则产生冲突,请问应该怎么解决该问题?是限制一个ID选择器上只能应用的一个DIV上还是有别的解决方法,或者是我对ID选择器的使用方法理解有错误,请老师解答。。。。。
大龙虾,
如果用使多个元素使用某相同的CSS样式,就不要使用ID选择器,而要使用类别选择器。ID的目的就是要选择页面中唯一的元素。
还有一个问题,就是为什么CSS代码都被注释掉呢?例如
好像在教程里面没有讲哦!!!
飞飞 ,
这是为了和很古老的浏览器兼容的语法,
现在的浏览器都支持CSS了,所不用这样做了,不需要写在注释里了。
chance,第二课第6个页面里面的CSS代码:
h2.special, .special, #one{ /* 集体声明 */
text-decoration:underline; /* 下划线 */
}
我认为h2.special,是多余的,可以去掉,而且效果确实一样,不知道去掉后是否有语法错误?请指教!
去掉后应改为:
.special, #one{ /* 集体声明 */
text-decoration:underline; /* 下划线 */
}
飞飞 ,
这里是为了演示 选择器的语法, 并不完全是为了做出某个效果。主要是告诉读者 h2.special 这样一种写法的含义。
请问观看时怎么没有倒回去的按钮?有时一句话没听明白想倒回一点听该怎么控制?谢谢
aa ,
播放窗口下侧有播放控制条,可以控制播放进度的哦,如果实在不行,可以下载到硬盘上,然后找一个flv文件的播放器,再播放。
这么好的东西现在才看到。。老师这个是基础吗。您估计几年后会被新的技术所取代呢?
怕瓦落地,
这个东西在可见的未来,不会过时的,这是标准技术,非常稳定的。
哦,我明白了
你们的书在书店可以买到吗?
我们公司下面就是西北书城。要不我去买本
或者是网上购买吗?
冰缘,
谢谢您的支持~
我们只是作者,所以哪个地面书店可以买到,我们无法得到相关信息。这里建议您网上购买,价格便宜,还方便,可以参考:
http://learning.artech.cn/20070802.css-div-buy-book-online.html
你好,素材可以下载吗?我在学习。但是没你们的素材。
冰缘,
抱歉,这部分素材是图书的一部分,由于合出版社有合约,所以不能提供下载了。如果喜欢这本书的内容,不妨买一本,即可以支持为本书付出了努力的很多人,也可以使你学习起来更快捷。
再次感谢!
素材能下载不?
可以
牛牛,
抱歉,这部分素材是图书的一部分,由于合出版社有合约,所以不能提供下载了。如果喜欢这本书的内容,不妨买一本,即可以支持为本书付出了努力的很多人,也可以使你学习起来更快捷。
再次感谢!
[…] 第2课 CSS基本语法与核心概念 […]
我很想请教一个问题。就是例如腾讯的http://tech.qq.com/a/20071222/000024.htm评论提交板块,我在源代码中怎么查不到它的代码部分呢。。
我对他评论提交区域的“腾讯网”Logo挺感兴趣的,不知道怎么写在里面的
我没有仔细研究它的具体实现方法,不过我想可能是为了避免垃圾留言,用Javascript动态生成的一段代码,在页面源代码中看不到,这是不难实现的,如果对JS和DOM比较熟悉,做到这个不困难。
第二个你是说得浅灰色的背景图像吗?那个应该用CSS的背景图像(background属性)就可以实现了,我觉得应该也不困难。
请问右上角的搜索如何设计呀
mumakiss ,你好:
这是使用google提供的“custom search engin”即“定制搜索引擎”功能实现的,您的网站也可以实现的。您可以访问Google的网页: http://google.com/coop/cse/。
Tom你好,管理员的回答对于你的问题是不对的,他是说他这站是DIV CSS,而不是所有站都是DIV CSS,还有TABLE的。呵呵。
ShgHnn,你好!
呵呵,你说得有道理,我当时理解的是Tom问的是这个网站是不是CSS DIV做的,如果对于所有网站来说,那就多了,有很多方法了,谢谢你提出来的补充说明!
请问是不是所有的网站前台界面都是用CSS DIV设计的。
可以看看这个博客:http://blog.sina.com.cn/meilinshengshi168
Tom,你好!
没错,这个网站的页面正是用CSS DIV布局的。