设为首页  
联系我们  
加入收藏  
网页制作 冲浪宝典 图形图像 操作系统 软件教学 编程开发 认证考试 安全技术 站长专区 文学驿站 娱乐天地 游戏天地 办公软件
文章搜索
您的位置: 首页 >> 文章首页 >> 网页制作 >> CSS >> 网页标准化制作:CSS的超级技巧大放送
精品推荐
CSS点击TOP10
·常用CSS大全
·DIV CSS网页布局实例解析:实现表格形式
·网页排版CSS教学
·网页特效代码:纯CSS制作的网页下拉菜单
·实现CSS图片边框效果的方法
·改变IE的字体大小设置时,页面字体不发生改变,怎样实现?
·CSS中文教程
·网页制作实例CSS用一张图片实现圆角
·让css使网页图片半透明
·网页制作小工具大全(下)
网页制作点击TOP10
·菜鸟架设动网论坛全教程
·网页模板的使用方法 (教程)
·网页对联广告代码效果大全
·初学者入门:如何学习网页制作?
·用JavaScript实现文件图片滚动效果
·常用CSS大全
·网页自动转向代码
·图片循环滚动完美解决
·DIV CSS网页布局实例解析:实现表格形式
·JS表格排序新法
精选专题

网页标准化制作:CSS的超级技巧大放送

作者: 来源:http://www.xgdown.com/ 时间:2007-4-9 13:42:08

网页标准化制作:CSS的超级技巧大放送(2)   * {
  margin:0;
  padding:0;
  }


  六.不需要重复定义可继承的值

  CSS中,子元素自动继承父元素的属性值,象颜色、字体等,已经在父元素中定义过的,在子元素中可以直接继承,不需要重复定义。但是要注意,浏览器可能用一些默认值覆盖你的定义。

  七.最近优先原则

  如果对同一个元素的定义有多种,以最接近(最小一级)的定义为最优先,例如有这么一段代码

  Update: Lorem ipsum dolor set

  在CSS文件中,你已经定义了元素p,又定义了一个classupdate

以下是引用片段:
  p {
  margin:1em 0;
  font-size:1em;
  color:#333;
  }
  .update {
  font-weight:bold;
  color:#600;
  }


  这两个定义中,class=update将被使用,因为class比p更近。你可以查阅W3C的《 Calculating a selector’s specificity》 了解更多。

八.多重class定义
一个标签可以同时定义多个class。例如:我们先定义两个样式,第一个样式背景为#666;第二个样式有10 px的边框。

以下是引用片段:
.one{width:200px;background:#666;}
.two{border:10px solid #F00;} 


在页面代码中,我们可以这样调用

以下是引用片段:
<div class=one two></div> 


这样最终的显示效果是这个div既有#666的背景,也有10px的边框。是的,这样做是可以的,你可以尝试一下。

九.使用子选择器(descendant selectors)
CSS初学者不知道使用子选择器是影响他们效率的原因之一。子选择器可以帮助你节约大量的class定义。我们来看下面这段代码:

以下是引用片段:
<div id=subnav> 
<ul> 
<li class=subnavitem> <a href=# class=subnavitem>Item 1</a></li>> 
<li class=subnavitemselected> <a href=# class=subnavitemselected> Item 1</a> </li> 
<li class=subnavitem> <a href=# class=subnavitem> Item 1</a> </li>
</ul> 
</div> 


这段代码的CSS定义是:

以下是引用片段:
div#subnav ul { /* Some styling */ } 
div#subnav ul li.subnavitem { /* Some styling */ } 
div#subnav ul li.subnavitem a.subnavitem { /* Some styling */ } 
div#subnav ul li.subnavitemselected { /* Some styling */ } 
div#subnav ul li.subnavitemselected a.subnavitemselected { /* Some styling */ } 


你可以用下面的方法替代上面的代码

以下是引用片段:
<ul id=subnav> 
<li> <a href=#> Item 1</a> </li> 
<li class=sel> <a href=#> Item 1</a> </li> 

共5页 9 7 [1] [2] [3] [4] [58 :>

网页标准化制作:CSS的超级技巧大放送 相关文章:
网页标准化制作:CSS的超级技巧大放送 相关软件:
特别声明:本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载,但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站,我们表示深深的谢意。如果本站转载的文章有版权问题请联系编辑人员,我们尽快予以更正。
转载请注明来源:http://www.xgdown.com