当前位置:首页 > Web开发 > 正文

第1部分 html常用标签

2024-03-31 Web开发


一、HTML常用标签

<!DOCTYPE html>第一行的 DOCTYPE 表示文档类型,这是HTML5的标准格式
<html lang="zh-CN"></html> 在 html 标签中要设置语言,英语是:en,中文是:zh-CN
<meta charset="UTF-8"> 在 meta 标签中一定要设置字符集,是文档存储时用的字符集,还可以设置 GBK


1、排版标签

<h1></h1> h 标签用于设置标题,h1 标签最大,h6标签最小

<p></p> p 标签用于生成段落

<hr /> 标签用于生成一条横线,该标签是一个单标签

<br /> 强制换行标签,p 标签也可以换行,但是p标签表示的是段落,所以行距会很大。

div span 标签是没有语义的,都用来布局的。但是一行只能有一个 div 标签。对于 span 标签一行可以有多个。


2、文本格式化标签 <b></b>,<strong></strong>,都是将文字以粗体方式显示。XHTML 推荐使用 strong 标签 <i></i>,<em></em>,都是让文字以斜体显示,同样推荐使用 em 标签 <s></s>,<del></del>,文字以加删除线方式显示,推荐使用 del 标签 <u></u>,<ins></ins>,文字以加下划线方式显示,推荐使用 ins 标签


3、img 标签

img 标签必须要有一个 src 属性,该属性的值是图片的URL地址或者存储地址,属性如下:

属性 属性值 描述
src   文本   图片路径  
alt   文本   图片不能显示时的替换文本  
title   文本   鼠标悬停时显示的内容  
width   像素(XHTML不支持%页面)   设置图片宽度  
height   像素(XHTML不支持%页面)   设置图片高度  
border   数字   设置图片边框的宽度  

通常 width 和 height 属性只设置一个一即可。


4、链接标签,也就是 a 标签,重点

a 标签有两个属性 href 和 target。其中 href 属性是必须的。href 属性可以指向外部链接、内部链接、空链接。例如:

<a href=http://www.mamicode.com/"https:/www.baidu.com">百度一下</a>,这个是指向外部链接 <a href=http://www.mamicode.com/"01-html骨架标签.html">内部链接</a>,这个是指向本地一个 html 文件就是内部连接 <a href="#">空链接</a>,这个 href="#" 表示是一个空链接

a 标签的另一个属性 target 的属性值是 _self 和 _blank 两种,默认是 _self。使用 _blank 时表示在新的空白页打开链接。

a 标签不仅可以对文字创建链接,对图像、表格、音频等都可以创建链接。


5、注释标签

html 的注释标签是:
<!-- 注释内容 -->
注释内容在程序运行时是不会执行的。
在 sublime 中注释的快捷方式是同时按下 Ctrl + / 键。


6、路径

路径分为:相对路径 和 绝对路径。
相对路径,是从代码所在的这个文件出发,去寻找目标文件,通常所说的上一级、下一级、同一级,简单来说是相对于 文件 位于 HTML 的页面的位置。

如:src="images/xx.jpg",这里的就是同一级目录下的下一级目录中的 xx.jpg 文件。

如:src="../images/xx.jpg",这里是指上一级目录下的images目录下的 xx.jpg 文件

绝对路径:绝对路径使用较少,并且要注意绝对的写法,在windows中绝对路径符号是 ,而不是相对路径的 / 符号。当然绝对路径可以使用 网页的地址。


7、锚点

锚点通常用在同一个页面中跳转,被锚的点是标签的 id 属性的值。例如在页面开始部分的 a 标签中,a 标签内容如下:
<a href="#one">第一集</a>
前面说过,href="#" 是指向空白页,这里是 href="#one" 表示指向本页面的一个标签的 id 属性值是 one 的位置,例如在本页的后面标签中,某一个 h 标签的 id 属性是 one,h 标签内容如下:
<h2 id="one">第一集<h2/>
这时在页面的开始部分点击 第一集 就会跳转到本页的 h2 标签的 第一集 位置。这就是锚点。


8、base 标签

这个标签可以设置整体连接的打开的状态。语法如下:
<base target="_blank" />
该标签一定要写在<head></head>之间。添加这个标签及 target="_blank" 属性值后,在后面的 <body></body> 标签中的所有 a 标签都拥有这个属性,就是在新的页面打开链接。避免对每个 a 标签设置这个属性。


9、预格式化文本标签 pre

语法如下:

<pre> 此例演示如何使用 pre 标签 对空行和 空格 进行控制 </pre>

在这个标签内书写的文字会按照书写的模式显式,不需要换行和段落标签。由于不好整体控制,使用较少。


10、特殊字符

在 html 中有些特殊符号不能直接使用,例如空格、换行、大于、小于等,这时就要用特殊符号来做。

是以运算符 & 开头,以 分号运算符(;)结尾。

他们不是标签,而是符号。

HTML 中不能使用小于号 “<” 和大于号 “>”特殊字符,浏览器会将它们作为标签解析,若要正确显示,在 HTML 源代码中使用字符实体。

几个常用的特殊字符是:空格:?,小于号(<):<,大于号(>):>。还有其它一些特殊符号就不全部列出。


11、XHTML 是更严格更纯净的 HTML 代码。

XHTML 指可扩展超文本标签语言(EXtensible HyperText Markup Language)。

XHTML 的目标是取代 HTML。

XHTML 与 HTML 4.01 几乎是相同的。

XHTML 是更严格更纯净的 HTML 版本。

XHTML 是作为一种 XML 应用被重新定义的 HTML。

XHTML 是一个 W3C 标准。


12、 HTML和 XHTML之间有

XHTML 指的是可扩展超文本标记语言

XHTML 与 HTML 4.01 几乎是相同的

XHTML 是更严格更纯净的 HTML 版本

XHTML 是以 XML 应用的方式定义的 HTML

XHTML 是 2001 年 1 月发布的 W3C 推荐标准

XHTML 得到所有主流浏览器的支持

温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/41886.html