HTLM5常见问题列举分析

2019-09-10 郑州网站建设  

一、新的文档类型(Doctype

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"">

你还在使用上面这个既麻烦又难记的XHTML文档类型吗?如果还是这样的话,现在该切换到新的HTML5文档类型了。

<!DOCTYPE html>

二、图形(Figure)元素

考虑用下面的代码来标记图片?

<mg src=http://www.divcss5.com/html5/"path/to/image" alt="About image" />

<p>Image of Mars. </p>

很不幸,它不能用简单、富有语义关联的方式与图形的标题关联,因为它仅仅是用段落标记以及图片元素包裹着,而HTML5通过引进<figure>元素,改进了这一点。当结合 <figcaption> 元素使用时,我们就可以将图形标题与图形配对起来。代码如下:

<figure>

<img src=http://www.divcss5.com/html5/"path/to/image" alt="About image" />

<figcaption>

<p>This is an image of something interesting. </p>

</figcaption>

</figure>

三、字体

一个响应式的字体大小应关联它的父容器的宽度,这样它才可以适应客户端的屏幕。

CSS3 规范引入了一个新的单位叫 rem,和 em 类相似,但相对于 HTML 元素来说, rem 更易于使用。

rem 是相对于 HTML 元素的,不要忘了重置 HTML 的字体大小:

1.html { font-size:100%; }

完成后,您可以定义响应式的字体大小,如下所示:

1.@media (min-width: 640px) { body {font-size:1rem;} }

2.@media (min-width:960px) { body {font-size:1.2rem;} }

3.@media (min-width:1100px) { body {font-size:1.5rem;} }

请注意,旧浏览器不支持 rem 单元,所以不要忘了实现一个替代。


河南郑州做网站首选天择文化,我们专注郑州网站建设网站设计网站制作与开发,是中原地区专业的郑州网络公司,多年来我们一直努力,服务客户数百家,欢迎您的咨询。
本文链接:郑州网络公司http://tzchb.ieyo.com/dede/1722.html转载请标明出处,谢谢合作!
标签:
  • HTLM5
  • 类型
  • о
  • 文档
  • Docty