Heim > Web-Frontend > H5-Tutorial > html/css应用的方法

html/css应用的方法

WBOY
Freigeben: 2016-05-17 09:08:18
Original
1402 Leute haben es durchsucht

  

  html/css应用的方法

  1、制作透明效果

  opacity:0.7;

  filter:alpha(opacity=70);


  2、清除浮层的另外方法

  .clearfix:after {

  content:".";

  display:block;

  height:0;

  clear:both;

  visibility:hidden;

  }

  .clearfix{

  display:inline-block;

  }

  * html .clearfix {height:1%;}

  .clearfix {display:block;}


  3、div 块级元素分隔符

  span 行内元素分的区域隔符

  当页面内标签无法满足设计需要时,才会适当添加div和span等无语义标签来 辅助实现。


  4、标签语义化:

  搜索引擎看不到视觉效果,看到的只是代码,只能通过标签来判断内容的语义。


  5、语义化标签应注意的一些问题:

  • 尽可能少用无语义标签div和span;
  • 不要使用纯样式标签,例如b、font和u等,改用css设置。语义上需要强调的文本可以在strong或em标签里

  DTD:文档类型定义(标准模式和怪异模式)

  标准模式:浏览器根据规范表现页面。

  怪异模式:通常模拟老式浏览器的行为以防止老站点无法工作。(width包含padding和border的宽度,margin:auto;无法正常工作)

  如果漏写DTD声明,Firefox仍然会按照标准模式来解析网页,但在IE中(包含IE6\IE7\IE8)就会触发怪异模式。


  6、CSS reset:通过重新定义标签的样式,“覆盖”掉浏览器提供的默认样式


  7、模块化CSS

  模块与模块之间尽量不要包含相同的部分,如果有相同部分,应将它们提取出来,拆分成一个独立的模块。

  模块应在保证数量尽可能少的原则下,做到尽可能简单,以提高重用性。


  8、CSS命名

  驼峰命名法用于区分不同单词,划线用于表明从属。

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage