css基础系列教程基础语法2.pdfVIP

css 基础系列教程：CSS 基础语法2 作者：DIVCSS8 在上一节中我们讲到了自定义ID 选择器，为了以后JS 获取内容方便，所以说我们只能使用 一次。如果CSS 代码想多次重复使用怎么办呢。那么就时候就可以用自定义的class 选择符。 我们看一个下面这个示例： !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd html xmlns=/1999/xhtml head title class 选择器示例/title style type=text/css .diyi li a{color:#f00;} /style /head body ul class=diyi lia href=#项目编号1/a/li lia href=#项目编号2/a/li /ul ul class=diyi lia href=#项目编号2/a/li lia href=#项目编号3/a/li /ul a href=#我不会被改变/a /body /html 那么这两个项目列表都会发生变化。并且还要注意的就是CLASS 选择符可以一次使用多个。 在每个名称后边加一个空格即可，如 class=”diyi clear”这样就可以了。 还有一种选择符就是通用选择符是可以针对所有HTML 标签应用如下： *{padding:0px;margin:0px;} 这个我准备放到布局时在详细讲解。 咱们一直使用的都是内嵌样式，我们现在学习一个新的引入CSS 样式的方式，也是我们日后 经常用的链接样式。 使用链接样式有什么好处呢： 1、为了 SEO 方便，如果直接使用内嵌样式。那么会造成蜘蛛在爬行的时候，要爬行很多 CSS 代码 2、如果我们的样式需要针对网页中的多个文件应用。而内嵌明显不太适合，这时候就得用 到我们讲的链接样式了。 语法格式： link type=text/css rel=stylesheet href=css.css / 最关键的是href 需要大家改成自己写的CSS 样式文件 总结：通过使用链接的方式这样就实现了我们之前所说的HTML 与CSS 的分离。如果想更换 网页的风格，只需要更换CSS 样式文件即可。大家可以百度搜一下CSS 禅意花园。Html 是 固定的通过更换的CSS 样式文件，可以看到不同的风格的网页。也是新手学习CSS 推荐看的 编码，样式文件。 样式文件的优先级： 行内样式 内嵌样式 链接样式 导入样式 咱们通过一个实例认识一下 !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd html xmlns=/1999/xhtml head titledivcss8 示例/title style type=text/css p{color:#666;font-size:24px;} /style link rel=stylesheet type=text/css href=divcss.css/ /head body p style=color:#f00;/p /body /html Divcss.css 文件 p{color:#0f0;font-weight:bold;} 总结：行内样式，内嵌样式以及链接样式分别对P 中的实现了样式的更改。由于行内样式的 优先级比较高所以最终结果显示红色。 大家还需要注意的是后面的样式会覆盖上边的样式。 CSS 选择器命名 CSS 选择器命名要有三种：骆驼命名法，帕斯卡命名法，匈牙利命名法，我们下边分别看一 下： 骆驼命名法：指混合使用大小写字母来构成，也是为了以后工作中有一个团队交流中比较方 便。它的特点如下： 第一个单词以小写字母开始；第二个单词的首字母大写或每一个单词的首字母都采用大写字 母，例如：myFirstName 帕斯卡（pascal）命名法： 此CSS 命名规则与骆驼命名法类似。只不过骆驼命名法是首字母小写，而帕斯卡命名法是首 字母大写 匈牙利命名法：名称前面加上一个或多个小写字母作为前缀 red_nav