html5是什么意思
html5也是屬于Web代碼中一種語言,是下一代計算機前端語言標準,用戶在瀏覽網頁的時候其實都是通過html語言編寫的,再通過瀏覽器進行轉換成用戶可識別的信息,html5是在html4.0基礎上進行改進的,雖然目前html5技術還沒有大規模應用,但html5技術還是需要了解一些的。
html5頁面框架新布局的意義
1、html5可以讓很多網頁面代碼語義結構更簡單,代替了大量無意義的div標簽;
2、html5提升了網頁質量及用戶體驗度;
3、合并了JS和css低碼,提高了網站加載速度,減少了網站頁面加載時間;
4、html5語義結構對搜索引擎友好,更利于網站搜索引擎優化。



HTML5 頁面布局代碼:
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<meta http-equiv=”X-UA-Compatible” content=”ie=edge”>
<title>HTML5 頁面布局</title>
<link rel=”stylesheet” href=”./css/index.css”>
</head>
<body>
<header>
<div class=”container”>
<a href=”./index.html”><img src=”./images/logo.png” alt=”logo”></a>
<nav>
<a class=’Home active’ href=”#”>Home</a>
<a class=’Course’ href=”#”>Course</a>
<a class=’Actual’ href=”#”>Actual</a>
<a class=’Plan’ href=”#”>Plan</a>
<a class=’FAQ’ href=”#”>FAQ</a>
<a class=’Notes’ href=”#”>Notes</a>
</nav>
</div>
</header>
<section class=”banner”>
<ul>
<li class=”left”><a href=”#”><img src=”./images/banner/banner1.jpg” alt=”1″></a></li>
<li class=”active”><a href=”#”><img src=”./images/banner/banner2.jpg” alt=”2″></a></li>
<li class=”right”><a href=”#”><img src=”./images/banner/banner3.jpg” alt=”3″></a></li>
</ul>
</section>
<section class=”main”>
<aside>
<!– <samp> 標簽表示一段用戶應該對其沒有什么其他解釋的文本字符。要從正常的上下文抽取這些字符時,通常要用到這個標簽 –>
<h1>Recent <samp>Course</samp></h1>
<dl>
<dt>Hyper Text Markup Language</dt>
<dd>HTML is the standard markup language used to create web pages and its elements form the building blocks of all websites.</dd>
<dd><img src=”./images/Course/05_05.png” alt=”1″></dd>
</dl>
<dl>
<dt>Cascading Style Sheets</dt>
<dd>Cascading Style Sheets (CSS) is a simple mechanism for adding style (e.g., fonts, colors, spacing) to Web documents.</dd>
<dd><img src=”./images/Course/06_04.png” alt=”2″></dd>
</dl>
<dl>
<dt>JavaScript</dt>
<dd>JavaScript is a high-level, dynamic, untyped, and interpreted programming language.</dd>
<dd><img src=”./images/Course/09_07.png” alt=”3″></dd>
</dl>
<dl>
<dt>AngularJS</dt>
<dd>AngularJS is an open-source web application framework mainly maintained by Google and by a community of individuals and…</dd>
<dd><img src=”./images/Course/02_09.png” alt=”4″></dd>
</dl>
</aside>
<article>
<h1>Welcome to <samp>Massive Open Online Course!</samp></h1>
<p>We provide the latest knowledge to help you cope with the changing world!</p>
<img src=”./images/article.jpg” alt=”11″>
<p>We hope that all the students who love the Internet can be more convenient access to learning resources, using the Internet thinking to change our learning.</p>
<p>Focus on IT skills education MOOC, consistent with the development trend of the Internet down to earth’s MOOC. We are free, we only teach useful, we concentrate on education.</p>
</article>
</section>
<footer>
<div class=”container”>
<p>Copyright ? 2016 imooc.com All Rights Reserved.</p>
<span>
<img src=”./images/icon/qq.png” alt=”1″>
<img src=”./images/icon/sina.png” alt=”2″>
<img src=”./images/icon/weichat.png” alt=”3″>
</span>
</div>
</footer>
</body>
</html>
