HTML基础-------HTML标签(1)

HTML标签(1)

h系列(容器级双标签)

h系列标签分为六个等级(h1,h2,h3,h4,h5,h6)

语义：给文本添加一个标题

标题重要程度逐级递减,一个页面只能有一个h1级的标签,并且大多数时候会将h1标签与页面的logo结合在一起。p系列标签单独存在,不存在嵌套关系。

p标签(文本级双标签)

语义:一个段落

img标签(容器级单标签)

语义：引入一张图片,本身相当于一个特殊文本。

属性： src: 表示图片的来源,也就是路径

width: 表示图片的宽度

heigth: 表示图片的高度

border: 边框属性,可以设置边框高度。

title: 设置提示文本

alt: 设置图像找不到时的替换文本

查找方式

相对路径,绝对路径

相对路径：在同一文件夹下

绝对路径：用盘符查找(用的很少,因为这只能针对程序员本身来说)

练习(对于h,p,img标签的练习)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>img标签的使用</title>
</head>
<body>
       <h1>傲之追猎者----雷恩加尔</h1>
       <p>&nbsp;&nbsp;&nbsp;瓦斯塔亚的雷恩加尔是一名声名远扬又凶残无比的猎手。他的人生充满着
           追寻猎杀危险的生物的快感。他寻遍整个世界，只为寻
           找他能找到的最可怕的野兽，特别是寻找任何关于卡兹克的踪迹。这头来自虚空的野兽弄瞎了他的一只眼睛
           。雷恩加尔追寻着猎物，不为捕食也不为荣耀，只是为了纯粹的猎杀所带来的激烈美感。</p>
           <img src="http://img0.imgtn.bdimg.com/it/u=836048506,3381599528&fm=26&gp=0.jpg" title="狮子汪" alt="我真的是狮子汪"/>
</body>
</html>

HTML基础-------HTML标签(1)

猜你喜欢