css - body 嵌套 body 求解 (freeCodeCamp案例)
本文介绍了css - body 嵌套 body 求解 (freeCodeCamp案例)的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
前端新人一枚,最近在学跟freecodecamp的课程.
这里有一个案例中 使用了 body的嵌套 如下代码, 此案例中将兼容IE9的代码, 最后引入外部js文件的代码放到了外层的body中, 网页并不报错, 在网页调试工具中也只有一个body.
请问大神们, 这样有什么好处吗?
原网页: http://codepen.io/freeCodeCam...
<title></title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
<link rel="stylesheet" type="text/css" href="css/main.css"/>
</head>
<body>
<!-- Update 29.9.2015: <head></head> and <body></body> tags are included in this pen for quick copy/paste in case you to try this challenge offline -->
<head>
<title>Infinito Web Design Studio</title>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
<div class="container topnav">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
这是最后的代码, 把引入的js放到了外面的body上
</div>
</div>
</footer>
</body>
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js "></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="js/bootstrap.js "></script>
</body>
</html>解决方案
没有所谓的body嵌套这种用法。
注释里已经说了：<!-- Update 29.9.2015: <head></head> and <body></body> tags are included in this pen for quick copy/paste in case you to try this challenge offline -->
但是你用codePen的export是不需要<head>或<body>的。默认会吧html都放到新的<body>里，所以才会在<body>里又出现了<head>和<body>。没有报错是因为浏览器对这种不规范的结构做了优化，所以调试的时候只会看到一个<body>。
这篇关于css - body 嵌套 body 求解 (freeCodeCamp案例)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
