《CSS实战精粹》读书笔记(一)详解

  次阅读 作者:智能小宝 来源:互联网 2016-03-25 15:53 我要评论(0)

一些有语义的html标签

一些有语义的html标签

是否真的需要div标签?是否真的需要一个class属性?

自打CSS被越来越多的设计人员了解,在页面设计的时候,总是经常含有太多div标签或者是class属性。那么,在真实情况下,这些div标签是否真的有必要?这个class属性是否有必要加?在使用div时,根据上一条规则,你要想一下,在HTML中是否有比div更合适的标签存在,不要过分的迷恋div标签。

不要将单个元素包含进 div 标签中

上面只是书中的一个建议,其实有很多时候我们都并不需要div标签,看书中的例子吧:

<div id="menu">

<ul>

<li>First item</li>

<li>Second item</li>

<li>Third item</li>

</ul>

</div>这样不是更好吗?还可以减少一层dom结构,要知道dom层次太多的话,无论是我们寻找DOM元素还是页面载入速度,都是有影响的。

<ul id="menu">

<li>First item</li>

<li>Second item</li>

<li>Third item</li>

</ul>

程序员们还会在本该只需要在一个父对象上使用一次 class 属性的时候,在多个重复的元素中重复使用 class 属性

关于class属性的错误用法,这里也举一个示例吧,同样是抄的:

<ul>

<li class="cheese-type">Cheddar</li>

<li class="cheese-type">Mozzarella</li>

<li class="cheese-type">Parmesan</li>

<li class="cheese-type">Swiss</li>

</ul>这两种方法,哪个更优雅,自己想吧?

<ul class="cheese-types">

<li>Cheddar</li>

<li>Mozzarella</li>

<li>Parmesan</li>

<li>Swiss</li>

</ul>

不要忽略 DOCTYPE 标签

这里不解释HTML与XHTML的关系,也不说DOCTYPE标签使用的各种规范,如果感兴趣大家可以在这里找到 http://www.w3schools.com/tags/tag_DOCTYPE.asp。

自己写页面时,很少会写DOCTYPE标签,除非是IDE自动创建的,否则,真的懒的去写。用书中的话来讲就是:最被低估的标签。

那么,DOCTYPE标签到底能干什么?呵呵,这里网上相关的讨论很多,不再缀述,只是把W3C中的原话拿过来吧。呵。

Why specify a doctype? Because it defines which version of (X)HTML your document is actually using, and this is a critical piece of information needed by some tools processing the document.

For example, specifying the doctype of your document allows you to use tools such as the Markup Validator to check the syntax of your (X)HTML. Such tools won’t be able to work if they do not know what kind of document you are using.

But the most important thing is that with most families of browsers, a doctype declaration will make a lot of guessing unnecessary, and will thus trigger a “standard” rendering mode.

现代Web文档的三层结构

一个Web文档一般由三个层次结构组成,其中(X)HTML是文档的结构层,CSS是文档的表现层,而JavaScript则是文档的行为层。

本站文章信息来源于网络以及网友投稿,本站只负责对文章进行整理、排版、编辑,是出于传递更多信息之目的,并不意味着赞同其观点或证实其内容的真实性。如果您有什么意见或建议,请联系QQ28-1688-302!

人工智能实验室
相关文章相关文章
  • 未来两年人工智能要怎么走?看这篇就够了

    未来两年人工智能要怎么走?看这篇就够了

  • 无人驾驶汽车如何改变城市生活?听听他们怎么说

    无人驾驶汽车如何改变城市生活?听听他们怎么说

  • 英国研发“杀生”机器人 通过生命体获取能量

    英国研发“杀生”机器人 通过生命体获取能量

  • 韩春雨称已能重复实验结果 近期将有消息公布

    韩春雨称已能重复实验结果 近期将有消息公布

网友点评网友点评
阅读推荐阅读推荐

据国外媒体报道,在过去两年内,聊天机器人(chatbot)、人工智能以及机器学习的研发和采用取得了巨大进展。许多初创公司正利用人工智能和...

霍金 视觉中国 图 英国著名物理学家霍金(Stephen Hawking)再次就人工智能(AI)发声,他认为:对于人类来说,强大AI的出现可能是最美妙的...

文|郑娟娟 今年,人工智能(AI) 60岁了。在AI60岁的时候,笔者想要介绍一下AI100,一个刚刚2岁的研究项目,但它的预设寿命是100年,甚至更长...

AlphaGo与李世石的人机大战,为大众迅速普及了人工智能的概念。 但对谷歌而言,除了下围棋,现在的人工智能进展到哪一步了?未来,人工智能...