《HTML 5与CSS 3 权威指南(第4版·上册)》 —3.3.3 对新的结构元素使用样式

举报
华章计算机 发表于 2019/11/23 23:51:00 2019/11/23
【摘要】 本节书摘来自华章计算机《HTML 5与CSS 3 权威指南(第4版·上册)》一书中第3章,第3.3.3节,作者是陆凌牛。

3.3.3 对新的结构元素使用样式

因为很多浏览器尚未对HTML 5中新增的结构元素提供支持,我们无法知道客户端使用的浏览器是否支持这些元素,所以需要使用CSS追加如下声明,目的是通知浏览器页面中使用的HTML 5中新增元素都是以块方式显示的,如下所示。

// 追加block声明

article, aside, dialog, figure, footer, header, legend, nav, section, main

{   display: block; }

// 正常使用样式

nav{float;left;width:20%;}

article{float:right;width:79%;}

另外,Internet Explorer 8及之前的浏览器不支持用CSS的方法来使用这些尚未支持的结构元素,为了在Internet Explorer浏览器中也能正常使用这些结构元素,需要使用JavaScript脚本,如下所示。

// 在脚本中创建元素

<script>

document.createElement("header");

document.createElement("nav");

document.createElement("article");

document.createElement("footer");

document.createElement("main");

</script>

<style>

// 正常使用样式

nav{float;left;width:20%;}

article{float:right;width:79%;}

</style>

尽管这段JavaScript脚本在其他浏览器中是不需要的,但它不会对这些浏览器造成什么不良影响。另外,到了Internet Explorer 9之后,这段脚本就不需要了。


【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。