HTML标签成对存在,第一个是开始标签,第二个是结束标签。

HTML属性

属性会以键值对的形式出现,并在开始标签中规定。

实例:

  1. 链接 This is a link
  2. 标题居中

常用标签

水平线  
<hr />:在页面中创建水平线

注释  
<!-- This is a comment -->

空行  
<br />

在不产生新段落的情况下进行换行
<p>This is <br /> a para <br /> graph </ p>

文本格式化

<b> </b>:加粗
<i> </i>:斜体
<pre> </pre>:预格式文本,会保留空格与换行
<blockquote> </blockquote>:这是长引用
<q> </q>:这是 短引用

列表

# dl定义一个列表,dt定义了术语部分,dd定义了内容部分
<dl>
   <dt>计算机</dt>
   <dd>用来计算的仪器 ... ...</dd>
   <dt>显示器</dt>
   <dd>以视觉方式显示信息的装置 ... ...</dd>
</dl>

data-*

在HTML元素上嵌入自定义数据,可以被页面的javascript使用。
data-* 属性包括两部分:

  1. 属性名: 不含大写字母;
  2. 属性值: 任意字符串;
<html>
<head>
<script>
function showDetails(animal) {
    var animalType = animal.getAttribute("data-animal-type");
    alert(animal.innerHTML + "是一种" + animalType + "。");
}
</script>
</head>
<body>

<h1>物种</h1>

<p>点击某个物种来查看其类别:</p>

<ul>
  <li onclick="showDetails(this)" id="owl" data-animal-type="鸟类">喜鹊</li>
  <li onclick="showDetails(this)" id="salmon" data-animal-type="鱼类">金枪鱼</li>  
  <li onclick="showDetails(this)" id="tarantula" data-animal-type="蜘蛛">蝇虎</li>  
</ul>

</body>
</html>