html5+css3+jacascript
第二章:HTML5常用元素与属性
一:HTML5保留的常用元素
1. 基本元素.差不多都留下了。
<!--xx-->:注释
<html> :html页面根元素。html5可以省略
<head> :html页面头部分。html5可以省略
<title> :html页面标题。
<body> :html页面内容。
<style> :样式定义。
<h1>~<h6>:标题1-6。
<p> :段落定义。
<br> :换行。
<hr> :画水平线。
<div> :块级元素。容器作用。
<span> :小型块级元素。也是容器作用。
写一个例子吧。
<html>
<head>
<title>这个是标题</title>
</head>
<body>
<!--标题块-->
<div>
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
</div>
<!--华丽的水平线-->
</hr>
<!--内容块-->
<div>
<p>这是个段落</p>
<p>这也是个段落</br>第二行</p>
</div>
</body>
</html>
2. 文本格式化元素
<b> :加粗。
<i> :斜体。
<em> :强调,效果与斜体差不多。
<strong>:还是粗体。HTML5说是重要的文本,不知道有多重要。
<small> :小号字体文本。比普通的小点。HTML5说做免责声明、注意事项、法律规定、版权等事。
<sup> :定义上标文本(难道是n的平方)。
<sub> :定义下标文本(难道是n几n几的)。
<bdo> :定义文本方向。可以正着写,也可以反着写。
再来个例子:
<html>
<head>
<title>文本格式化元素</title>
</head>
<body>
<span><b>加粗加粗</b></span><br />
<span><i>斜体斜体</i></span><br />
<span><em>被强调了</em></span><br />
<span><strong>强壮的粗体</strong><br />
<span><small>好小的小号呢</small><br />
<span>X<sup>2</sup> + Y<sup>2</sup> = Z<sup>2</sub></span><br />
<span>a<sub>1</sub> = a<sub>2</sub> + a<sub>3</sub></span><br />
<span><bdo dir="ltr">从左至右</bdo></span><br />
<span><bdo dir="rtl">从右至左</bdo></span><br />
</body>
</html>
3. 语义相关元素
<abbr> :用于表示一个缩写。通常什么世界卫生组织啊什么都都喜欢用缩写
<address>: 地址。通常会斜体表示
<blockquote>:定义一段长的引用字段。会被缩进。
<q> :短的引用字段。浏览器会添加引号。
<cite> :表示作品(书、电影、歌曲)之类的。通常斜体表示。
<code> :代码段。
<dfn> :定义专业术语。通常会加粗或斜体。
<del> :表示要删除的字。会加删除线。
<ins> :表示插入的字。会加下划线。
<pre> :表示元素包含的文字已经进行了预格式化。回车、空格、tab之类会被保存下来。
<samp> :定义示范文本。
<kdb> :定义键盘文本。使用说明书等等会使用到。
<var> :表示一个变量。通常会斜体表示。
哎,又一个例子。
<html>
<head>
<title>语义相关元素</title>
</head>
<body>
<!--这里面的<br />都用<br>吧,省事-->
<div>
<abbr>WTO</abbr>
<address>大美利坚</address><br>
<!--用疯狂里面的诗吧-->
<blockquote>
锦瑟无端五十弦,一弦一柱思华年。<br>
庄生晓梦迷蝴蝶,望帝春心托杜鹃。<br>
沧海月明珠有泪,蓝田日暖玉生烟。<br>
此情可待成追忆,只是当时已惘然。<br>
</blockquote>
<!--这让我想到了-->
<p>
<q>曾经沧海难为水,除却巫山不是云。</q>
</p>
<code>
<!--很熟悉吧-->
<pre>
int main(void)
{
printf("Hello World!");
return 0;
}
</pre>
</code>
<!--哎下面不想写了,困。-->
</div>
</body>
</html>