HTML的常见标签及用法

这篇具有很好参考价值的文章主要介绍了HTML的常见标签及用法。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

一、注释标签

 形如:<!-- -->的格式就叫做注释标签,在代码中起到解释说明的作用。

HTML的常见标签及用法

二、标题标签

在HTML中有六种格式的标题标签类型,分别是h1,h2,h3,h4,h5,h6。对应的形式为:

HTML的常见标签及用法 HTML的常见标签及用法

 三、段落标签

当文章需要分段时,使用段落标签执行。

 使用p标签进行分段。

HTML的常见标签及用法这样就得到段落清晰的文章

HTML的常见标签及用法

段与段之间也存在一定的间隔。

注:

1.自动生成长文本:使用lorem + 回车键 ,可以自动生成一段随机的长文本。

2.列编辑:按住alt键,鼠标左键在要添加的光标的位置点一下,就可以同时输入多列

四、换行标签

在HTML中,单纯的使用回车进行换行是不可行的,如上图p标签内的文段,使用回车换行并没有影响最后的呈现结果。我们需要使用<br>,这是一个单标签。实现效果如下图:

HTML的常见标签及用法

 HTML的常见标签及用法

 五、空格标签

在HTML中,只允许单个空格,如果需要进行多个空格,则需要使用空格标签:&nbsp;  

HTML的常见标签及用法

 HTML的常见标签及用法

 六、格式化标签

1、加粗:strong标签/b标签

HTML的常见标签及用法

 2、倾斜:em标签/i标签

HTML的常见标签及用法HTML的常见标签及用法

3、下划线:ins标签/u标签 

 HTML的常见标签及用法HTML的常见标签及用法

4、删除线:del标签/s标签

HTML的常见标签及用法HTML的常见标签及用法

 上面四种格式化标签虽然有两种写法,但是效果是一样的。

观察发现标签分行写,但最终的结果在同一行,这样的标签称为行内标签。

 七、图片标签

img标签    其中有多个属性:

1.src(必填项)图片的路径,对于路径的不同填写的内容也不同:

1)对于同一路径下的图片可以直接描述图片的 “名字.格式”。

HTML的常见标签及用法HTML的常见标签及用法

2)对于在同一路径的文件夹下的图片则通过“文件夹名/名字.格式”。

HTML的常见标签及用法 HTML的常见标签及用法

 也可以写作:

HTML的常见标签及用法

 3)对于图片在上一级路径时通过“../名字.格式”。

HTML的常见标签及用法HTML的常见标签及用法

4)对于图片在上一级路径的文件夹内时通过“../文件夹名/名字.格式” 

 HTML的常见标签及用法HTML的常见标签及用法

5)上面四种是针对于相对路径,对于绝对路径而言也是可以的,但是不建议。

6)同样,网络路径也可以支持。 

2.alt属性,是当图片无法加载时,出现的提示性的文字。

3.title属性,当鼠标滑动到图片上时,对图片进行解释说明的语句。

4.width和height属性,对于图片的大小进行调整,一般可以只设置长或者宽,因为系统会根据你给出的数据对图片进行等比例的调整。

5.border属性,边框参数,图形周围的边框宽度。

八、超链接标签

a标签 :<a href="跳转的路径">标签名</a>

HTML的常见标签及用法HTML的常见标签及用法

 这是最基础的超链接,点击跳转后是在同一个标签页,如果我们想要跳转到一个新的标签页,那我们可以使用target标签。

HTML的常见标签及用法

 HTML的常见标签及用法

若想在同一个目录下的跳转,可以创建两个.html文件,如下图:

HTML的常见标签及用法HTML的常见标签及用法

# 空链接,# 在 href 中占位,不进行任何跳转。

将路径改为一个文件时,可以下载

HTML的常见标签及用法

 同样,也可以将文字改为图片的格式,点击图片进行跳转。

HTML的常见标签及用法

九、表格标签

 用来建立表格

HTML的常见标签及用法

基本的格式:

HTML的常见标签及用法

 HTML的常见标签及用法

 通过border设置的边框,若想将两根线合成一条线,可以使用cellspacing,将其设置为0;

HTML的常见标签及用法

 若想将文字居中,可以使用CSS的方法。

HTML的常见标签及用法

意为将td的文本居中。 

 同样,也可以在开始标签中设置这些属性:

HTML的常见标签及用法

 介绍属性的含义:

HTML的常见标签及用法

 十、有序列表,无序列表,自定义列表

1、有序列表:

HTML的常见标签及用法HTML的常见标签及用法

 2、无序列表:

HTML的常见标签及用法HTML的常见标签及用法

 3、自定义列表:dl-总标签、dt-小标题、dd围绕标题来说明的记得小点

HTML的常见标签及用法HTML的常见标签及用法

 十一、合并单元格

HTML的常见标签及用法

 HTML的常见标签及用法HTML的常见标签及用法

 rowspan同理。

十二、表单标签

1、单行输入框:

HTML的常见标签及用法HTML的常见标签及用法

 2、密码输入框:

HTML的常见标签及用法HTML的常见标签及用法

3、选择框:

 HTML的常见标签及用法HTML的常见标签及用法

 对于这种选择框,,每个框都可以选中,为了实现单选框,我们可以将选项定义一个相同的值。

HTML的常见标签及用法HTML的常见标签及用法

 如果想要文字也可以选中,可以使用label属性。

HTML的常见标签及用法

使用checked可以生成一个默认选中的状态。

 HTML的常见标签及用法

HTML的常见标签及用法

 4、复选框:

HTML的常见标签及用法HTML的常见标签及用法

 5、按钮:

HTML的常见标签及用法HTML的常见标签及用法

 6、文件选择器:

HTML的常见标签及用法HTML的常见标签及用法

 7、清空按钮:

HTML的常见标签及用法

 HTML的常见标签及用法

 十三、无语义标签

div标签,块级元素独占一行

span标签,行内元素不独占一行

上述标签除了input系列,都可以用无语义标签代替

 十四、下拉标签

select标签和option标签

HTML的常见标签及用法HTML的常见标签及用法 

selected为默认选定,写在上海这一行,选项就默认为上海。

 HTML的常见标签及用法HTML的常见标签及用法

 十五、textarea标签

HTML的常见标签及用法HTML的常见标签及用法文章来源地址https://www.toymoban.com/news/detail-498269.html

到了这里,关于HTML的常见标签及用法的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • HTML-常见标签、HTML5新特性

    (1) C/S架构即Client/Server(客户机/服务器)结构。 (2) C/S 架构特点 ​ C/S结构在技术上很成熟,它的主要特点是交互性强、具有安全的存取模式、网络通信量低、响应速度快、利于处理大量数据。但是该结构的程序是针对性开发,变更不够灵活,维护和管理的难度较大。通常只

    2024年02月11日
    浏览(71)
  • HTML常见标签和作用

    HTML(HyperText Markup Language)的基本结构包括以下几个主要部分: !DOCTYPE html :文档类型声明,它告诉浏览器文档采用哪个HTML版本。通常位于HTML文档的开头,以确保浏览器正确解释文档。 html :HTML文档的根元素。它包含了整个HTML文档的内容,并定义了文档的开始和结束。 he

    2024年02月09日
    浏览(30)
  • HTML常见标签详解

    俺写这篇文章就是为了在需要的时候可以通过这个来复习,这里主要讲的就是 认识html基本结构 学会使用常见的html标签 1. 认识 HTML 标签 举例: 标签名(body)需要放在里面. 大部分的标签都是 成对 出现的, xxx 作为开始标签,并且由 /xxx 结束(结束标签),如同上面的. 少数

    2024年02月11日
    浏览(37)
  • html5中的meta标签用法详解

    来源:视频砖家 html5中的meta标签主要用于描述网页的元数据,它可以用于描述网页的标题、、描述、作者、版权等信息,还可以用于设置网页的字符集、设置网页的刷新时间、设置网页的跳转页面等。 meta charset=\\\"utf-8\\\":用于定义网页的字符集为 UTF-8,UTF-8 - Unicode 字符

    2024年02月16日
    浏览(40)
  • 【温故而知新】HTML元素/属性/标题/注释/段落/文本格式/头部/主体

    HTML(HyperText Markup Language,超文本标记语言)是用于创建网页的标准标记语言。它被用来描述网页的结构和内容,并且是网页浏览器能够解析和渲染网页的基础。HTML5 是 HTML 的最新版本,增加了许多新的元素和功能,以适应现代网页开发的需求。 HTML5 提供了许多新的元素和

    2024年01月16日
    浏览(43)
  • 【JAVAWEB】HTML的常见标签

    目录 1.HTML结构 1.1认识HTML标签 1.2HTML文件基本结构 1.3标签层次结构 1.4快速生成代码框架 2.HTML常见标签 注释标签 标题标签:h1-h6 段落标签:p 换行标签:br 格式化标签 图片标签 超链接标签:a 表格标签 列表标签 表单标签 form标签 input标签 lable标签 select标签 textarea 无语义标签

    2024年02月06日
    浏览(31)
  • HTML img标签识别base64图片格式

    红色框框为需要带上的格式,有这个格式img标签才能对base64进行解码,后面白色框框为base64编码 还有一些其他格式为: data:,文本数据 data:text/plain,文本数据 ;javascript:;,HTML代码 ;javascript:;;base64,base64编码的HTML代码 data:text/css,CSS代码 data:text/css;base64,base64编码的CSS代码 data:text/ja

    2024年02月16日
    浏览(38)
  • 【HTML5】HTML5 多媒体标签 ① ( audio 音频标签 | 音频标签常见属性值设置 | 音频标签默认代码设置 | 音频标签设置多种类型音频文件 )

    传统 HTML 开发中 , 如果想要向网页中嵌入音频和视频 , 需要 使用 Flash 浏览器插件才能实现 ; 在 HTML5 中 , 使用 多媒体标签 , 即可实现向浏览器中插入音视频 , 多媒体标签如下 : 音频标签 : audio 视频标签 : video HTML 5 的 audio 音频标签 , 支持 ogg / mp3 / wav 三种格式的音频 , 不同的

    2024年02月15日
    浏览(57)
  • 【Java-时间格式解析】Java解析形如 yyyy-MM-ddTHH:mm:ssZ 的时间格式

    日期时间字符串格式 ECMAScript 基于 ISO8601 扩展格式的简化定义了日期时间的字符串交换格式。格式如下: YYYY-MM-DDTHH:MM:ss.sssZ 其中字段如下: 格式 含义 YYYY 是公历中0000到9999年的十进制数字。 - “-”(连字符)在字符串中实际出现两次。 MM 是一年中从01(1月)到12(12月)的

    2024年02月09日
    浏览(34)
  • 常见的 HTML<meta> 标签的 name 属性及其作用

    HTML中的 meta 标签可以通过 name 属性提供元数据,这些元数据可以用于指定有关文档的信息,以及控制浏览器和搜索引擎的行为。 name 属性通常与其他属性一起使用,如 content 、 charset 、 http-equiv 等,以提供更具体的元数据信息。 以下是一些常见的 meta 标签的 name 属性及其作

    2024年02月11日
    浏览(41)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包