美文网首页程序猿的自我修养读书代码改变世界
无懈可击的web设计学习笔记(一)

无懈可击的web设计学习笔记(一)

作者: 力气强 | 来源:发表于2014-01-22 13:59 被阅读479次

本书旨在让读者掌握一个非常重要的观念,那就是:

  • 更精简的代码
  • 增强的可用性
  • 更加容易维护

让所有浏览器都能应用html5元素

如今html5非常的流行,可是只有一些比较新的浏览器可以识别并且应用它。一些低版本的浏览器不能识别html5元素,这个真心搞得人很不爽,不过现在有了解决办法了。

最简单的方法是使用Remy Sharp编写的一个简单的JavaScript shim,网址在这里:http://remysharp.com/2009/01/07/html5-enabling-script/

具体的方法是:将下面显示的代码添加到文档的<head>中,就可以为IE8及更低版本从Google加载该工具,从而可以在IE中使用这些新的html5元素。

<!-- enable HTML5 elements in IE7+8 -->
<!-- [if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif] -->

重置样式

浏览器通常会默认应用外边距、内边距的其他一些样式,而且不同的浏览器的规则是不一样的。所以如果不重置样式的话,做出来的网页会在不同的浏览器显示不同的效果。

为了消除它们的影响,这里我介绍一个重置样式表,它们是一组css规则,为设置页面的样式建立了一个统一的基础。

重置样式位于其他所有样式之前,如果没有使用外部样式表,它们位于主样式表的顶部;如果使用了外部样式表,则要先于其他样式表连接进来。

推荐使用Eric Meyer创建的重置样式表,他会根据最新的情况及时进行更新:http://meyerweb.com/eric/tools/css/reset/

还需注意的是,在使用html5时,一些较早的浏览器不支持html5中的新元素,所以要给一些元素加声明diaplay:block;,这一点很重要。否则,在设置它们的样式时可能会遇到一些奇怪的问题。

相关文章

  • 无懈可击的web设计学习笔记(一)

    本书旨在让读者掌握一个非常重要的观念,那就是: 更精简的代码 增强的可用性 更加容易维护 让所有浏览器都能应用ht...

  • 无懈可击的web设计学习笔记(二)

    本篇文章就web设计中“如何设定页面文字大小”展开讨论。 为什么不采用像素 现今大多数网站都是以“像素”来设置页面...

  • 无懈可击的web设计学习笔记(三)

    本文主要讲的内容为:可伸缩的导航栏,让网站导航栏能够适应任意大小的文字或者任何数量的内容。 html 就导航栏而言...

  • 2月17笔记

    第4天web学习笔记,已标明今天的笔记 有道云笔记

  • 2月16笔记

    第三天web学习笔记,已标明今天的笔记。 有道云笔记

  • HTML基础学习笔记

    原 Blog 链接:HTML基础学习笔记 自学 html 基础笔记 Web 前端简单介绍 web 前端包含: pc...

  • 2018-01-04

    Web学习笔记--从最基础的开始 一、web前端开发语言: HTML、 CSS 、JavaScript HTML:...

  • 2月23笔记

    第十天web前端学习笔记 有道云笔记

  • 2月21笔记

    第八天web前端学习笔记 有道云笔记

  • 2月20笔记

    第七天web前端学习笔记 有道云笔记

网友评论

本文标题:无懈可击的web设计学习笔记(一)

本文链接:https://www.haomeiwen.com/subject/hlbctttx.html