1. HTML标签是由尖括号包围的关键词,如< html >。 2. 标签成对出现,如 3. 标签关系:包含关系,并列关系
所有标签的< 与其后边跟的字符间没有空格,本文加了空格是防止自动识别为HTML语言,切记切记
我的第一个页面 niubi
标签名 | 定义 | 说明 |
---|---|---|
HTML标签 | 最大的标签,称之为跟标签 | |
文档的头部 | 在head标签中必须设置title标签 | |
文档的标题 | 让页面拥有属于自己的网页标签 | |
文档的主题 | 元素包含文档的所有内容,页面内容基本都是放在body里边的 |
< !DOCTYPE html> 表示采用html5版本,处于最前面,是文档类型声明标签。
lang 语言种类,用来定义当前文档显示的语言。
en---英语
zh-CN---中文
学习标签,重点是要记住每个标签的语义,根据语义,在何时的地方给一个最为合适的标签,可以让页面结构更为清晰。
6个等级的< h1>---< h6>,作为标题使用,依据重要性递减
特点:
1.由大到小,从重到轻依。
2.独占一行,只在一行内显示效果
< p> 段落标签 < /p>
< br />,单标签,只是简单的另起一行,与分段还是不一样的
比如设置粗体、斜体、或下划线效果。
标签语义:突出重要性,比普通文字更重要。
语义 | 标签 | 说明 |
---|---|---|
加粗 | 或者 | 更推荐使用 |
倾斜 | 或者 | 更推荐使用 |
删除线 | 推荐使用 |
|
下划线 | 或者 | 推荐使用 |
< div> 和< span>没用语义,就像一个盒子,用来装内容的。
div是division的缩写,表示分割,分区,span意为跨度、跨距。
特点:
1.< div> 标签用来布局,一行只能放一个< div>标签
2.< span>,一行可以放多个< span>。
< img src="图像URL"/>,图片和网页代码在一个路径下。
图像标签的其它属性
属性 | 属性值 | 说明 |
---|---|---|
src | 图片路径 | 必须属性 |
alt | 文本 | 替换文本,图像不能显示时的显示该文本 |
title | 文本 | 提示文本,鼠标放到图像上,显示的文字 |
width | 像素 | 设置图像的宽度 |
height | 像素 | 设置高度 |
border | 像素 | 设置边框粗细 |
注意:
title时鼠标放在照片上要等几秒才会显示提示文本
2. border一般通过css指定 3. 必须写在标签名的后边 4. 属性不分先后顺序,标签名与属性,属性与属性间均已空格隔开
相对路径分类 | 符号 | 说明 |
---|---|---|
同一级 | < img src="wf.jpg" /> | |
下一级 | / | |
上一级 | ../ |
绝对路径,可以选择自己电脑里的文件的绝对位置,也可以选择完整网络地址。
< a href="跳转目标" target="目标窗口的弹出方式"> 文本或者图像
< /a>。
href, 指定链接目标的地址
target,指定链接页面的打开方式,_self 为默认值, _blank为在新窗口中打开。
链接分类
1.外部链接,例如< a href="百度一下,你就知道"> 百度< /a>
2.内部链接:网站内部页面之间的相互链接,直接链接内部页面名称即可,例如< a href="index.html">首页< /a>
3.空链接:当前没有确定的链接目标,< a href="#">首页< /a>。
4.下载链接:herf里面地址是一个文件或者压缩包,一般在项目中,该地址与html文件在一个根目录下。
5.网页元素链接:网页中的各种元素,效果是,点击这些元素就会跳转页面
6.锚点链接:点击链接,可以快速定位到页面中的某个位置
在链接文本的href属性中,设置属性值为#名字的形式,如< a href="#two"> 第二集< /a>;找到目标位置标签,里面添加一个id属性=名字,如< h3 id="two">第二集介绍< /h3>。
注释标签
注释以结束
快捷方式:ctrl+/ 来把文本注释或者取消注释
特殊字符
有一些字符已经有使用意义,或者其它的不方便打出,就有如下的特殊字符。
特殊字符 | 描述 | 字符的代码 |
---|---|---|
空格 |   | |
< | 小于号 | < |
> | 大于号 | > |
& | 和号 | & |
¥ | 人民币 | ¥ |
© | 版权 | © |
® | 注册商标 | ® |
℃ | 摄氏度 | ° |
± | 正负号 | ± |
✖ | 乘号 | × |
➗ | 除号 | ÷ |
平方 | ² | |
立方 | ³ |
注意:代码后边都有";",这里防止自动识别为HTML语言