html5.0学习

最新推荐文章于 2024-09-26 18:34:44 发布

Co丿Hx

最新推荐文章于 2024-09-26 18:34:44 发布

阅读量972

点赞数

文章标签： html5 css 标签

本文链接：https://blog.csdn.net/qq_23301703/article/details/45270375

版权

html5.0

万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言（HTML）的第五次重大修改（这是一项推荐标准[1] 、外语原文：W3C Recommendation。)

html5.0的架构

Html5.0被认为是HTML，CSS和Javascript结合的产物，这三者都是可靠的技术并且在Html5.0规范下组织为一个整体，html负责结构，css负责在屏幕上呈现该结构和内容，而Javascript负责其余一些任极为重要的工作

html的基本标签

<HTML>文件开始 <HEAD>标头区开始 <TITLE>...</TITLE>标题区 </HEAD>标头区结束

<BODY> 本文区开始本文区内容（正文） </BODY>本文区结束

Css：css是对html的板式进行控制没有css网页上面的内容将混乱不堪

这里介绍下css有几种引用方式对各个标签的格式的控制

1.通过关键字引用 p｛font-size：20px｝这样p标签包围的所有内容都会被设置为20像素.

2.通过id属性引用#text1{font-size:20px} 这样这个规则将会应用到id=“text1”的元素上.

3.通过class属性引用.text1{font-size: 20px}这个规则将会应用到标签注明为class=“text1”的标签上.

这是一个简单的网页

网页的源代码为

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="description" content="this is an html5 example" <meta name="keywords" content="HTML5.CSS3.JavaScript"> <title>html02</title> <style> p { font-size: 50px} </style> <link rel="stylesheet" href="mystyles.css"> </head> <body> <div id="wrapper"> <p style="font-size: 30px">My text:HX</p> <header id="main_header"> <h1>this is the main title of the website</h1> </header> <nav id="main_menu"> <ul> <li>home</li><li>photos</li><li>videos</li><li>contact</li> </ul> </nav> <div id="container"> <section id="main_section"> <article> <header> <hgroup> <h1>Title of post one</h1> <h2>文章1的副标题</h2> </hgroup> <time datetime="2010-10-12" pubdate>posted 12-10-2011</time> </header> This is the text of my first post <figure> <img src="http://minkbooks.com/content/myimage.jpg"> <figcaptin> this is the image of the first post </figcaptin> </figure> <footer> <p>coments (0)</p> <address> <a href="http://www.jdgauchat.com">JD Gauchat</a></address> </footer> </article> <article> <header> <hgroup> <h1>Title of post two</h1> <h2>文章2的副标题</h2> </hgroup> <p>发布于 12-10-2011</p> <time datetime="2010-10-12" pubdate>posted 12-10-2011</time> </header> This is the text of my second post <footer> <p>coments (0)</p> </article> </section> <aside id="main_aside"> <blockquote>Article number one</blockquote> <blockquote>Article number two</blockquote> </aside> </div> <footer id="main_footer"> Copyright © 2014-2015 </footer> </div> </body> </html>