HTML5的基本结构及段落.换行.水平线.文本标签

于 2024-09-08 18:31:44 发布
阅读量522 收藏 15
点赞数 21
文章标签： java 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/LL_336/article/details/142030415
版权

基本结构

1.<! DOCTYPE html>

DOCTYPE是document type（文档类型）的缩写。<!DOCTYPE html>是H5的声明位于文档的最前面，处于标题之前。

2.HTML标签<html>  </html>

定义HTML文档。

3.head标签<head> </head>

head标签用于定义文档的头部.

<!DOCTYPE html>  

<html lang="en">

<head><!--文档头部标签-->

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

</head>

</html>

4.tiitle标签<title>  </title>

页面标题标签，将HTML文件的标题显示在浏览器的标题栏中，此标签只能应用于<head> </head>之间。        

<!DOCTYPE html>  

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<body>

</html>

5.body标签<body> </body>

 文档主题标签，页面核心内容。

<!DOCTYPE html>  

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<body><!--文档主题标签，页面核心内容-->

    主体内容

</body>

</html>

6.meta标签<meta> 

元信息标签，在HTML中是一个单标签，可重复出现在头部标签中。

<!DOCTYPE html>  

<html lang="en">

<head>

    <meta charset="UTF-8"><!--元信息标签（标题标签和页面描述标签）-->

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<body>

</body>

</html>

文本标签

<h1>....</h1>最大（可用于展现主要内容）

...........

<h6>...</h6>最小（可用于展现次用内容）

<!DOCTYPE html>  

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<body>

    <h1>一级标签</h1> 

    <h2 >二级标签</h2>

    <h3 >三级标签</h3>

    <h4 >四级标签</h4>

    <h5>五级标签</h5>

    <h6>六级标签</h6>

</body>

</html>

段落标签

<p>......</p>

在HTML格式里它会根据窗口的宽度自动转到下一行

<!DOCTYPE html>  

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>段落标签</title>

</head>

<body>

    <p>段落标签1</p>

    <p>段落标签2</p>

</body>

</html>

换行标签

<br/>

可打断HTML文档中正常段落的行间距和换行。可放在任意一行中的任意位置。

<!DOCTYPE html>  

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>换行标签</title>

</head>

<body>

    <h1>一级标签</h1> <br/> <h2 >二级标签</h2><br/><h3>三级标签</h3>

    <h4>四级标签</h4>

    <h5>五级标签</h5>

    <h6>六级标签</h6>   

</body>

</html>

水平线标签

<hr/>

单标签，在网页中输入一个<hr/>,即添加一个默认样式的水平线。

<!DOCTYPE html>  

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>换行标签</title>

</head>

<body>

    <h1>一级标签</h1>

    <hr/>

    <h2 >二级标签</h2>

    <hr/>

    <h3>三级标签</h3>

</body>

</html>

骑麦当劳吃薯条
关注
HTML5+CSS3[标签(标题、段落、换行、水平线、图片、超文本链接、列表、表格)](二)-全面详解（学习总结---从入门到深化）
02-02 1477
本阶段为基础阶段，主要学习HTML基本结构、骨架、标签和CSS基本样式。通过对这些标签的使用，熟悉布局的搭建结构。合理运行对应标签实现试图效果，是本阶段必须要掌握的知识，为接下来的学习奠定基础。
HTML-换行
最新发布
m0_73839298的博客
05-03 105
【代码】HTML-换行。
HTML 水平线
m0_67633378的博客
04-22 373
<hr> 标签在 HTML 页面中创建水平线。 hr 元素可用于分隔内容。 实例 <p>这是一个段落。</p> <hr> <p>这是一个段落。</p> <hr> <p>这是一个段落。</p>
html水平线向上移动代码,HTML 水平线
weixin_39926311的博客
06-04 3091
定义和用法：标签在HTML页面中创建一条水平线。水平分隔线(horizontal rule)可以在视觉上将文档分隔成各个部分。HTML 与 XHTML 之间的差异在 HTML 中， 标签没有结束标签。在 XHTML 中， 必须被正确地关闭，比如 。在 HTML 4.01 中，hr 元素的所有呈现属性均不被赞成使用。在 XHTML 1.0 Strict DTD 中，hr 元素的所有呈现属性均不被支持...
html中水平线一半写什么代码,html水平线标签和注释标签
weixin_39596090的博客
05-30 1085
有的时候我们需要在网页中创建一条水平线，用以分割段落与段落之间的内容，这样会让文章具有层次感，有利于用户阅读。html水平线html水平线标签表示为：使用方法，直接在html标记状态下插入此水平线符号，例如：“”和我经常用到的html标签不一样，html水平线标签是一个短标签，不需要属性值，但是有的时候我们也需要控制水平线的高度、宽度、颜色等等，让我们记录下html水平线标签的属性表示方法。例一：...
Web前端基础：HTML5文本标签.pptx
05-06
本节主要探讨HTML5中的文本标签，包括文字格式化、段落格式化、标题以及水平线。 1. **文字格式化**： - `<font>`元素：在HTML4中，`<font>`用于设置文本的字体、大小和颜色，但在HTML5中已不推荐使用，因为它不...
HTML5文本控制标签案例.pdf
07-11
这些基本的HTML5文本控制标签是构建网页内容的基础。它们使得文本能够按照设计师和开发者的意图呈现，提高了可读性和页面的美观度。理解并熟练使用这些标签对于任何想要从事网页设计和开发的人来说都是至关重要的。...
HTML5-标签集合.pdf
08-11
4. **水平线标签**：`<hr/>`也是一个单标签，用于在页面中插入一条水平线，常用于分隔内容。 5. **字体样式标签**：`<strong>`使文本加粗，强调其重要性；``使<em>文本倾斜，表示文本的强调或引用。 6. **注释标签...
html5常用标签.txt
11-18
4. **`<hr>`**: 水平线标签，用于分隔内容。 5. **`<bdo>`**: 用于覆盖默认的文本方向。 6. **`<pre>`**: 预格式化文本，保留空格和换行。 7. **`<abbr>`**: 缩写标签，用于标记缩写词。 8. **`<address>`**...
013_html水平线
aihiao的专栏
10-08 296
1. <hr />标签在html页面中创建水平线。 2. hr 元素可用于分隔内容。 3. 使用水平线(<hr /> 标签)来分隔文章中的小节是一个办法(但并不是唯一的办法)。 4. html水平线例子 4.1.代码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <h.
html中水平线一半写什么代码,HTML-段落和水平线标签
weixin_29325955的博客
05-30 537
1、段落标签单词缩写: paragraph段落在网页中要把文字有条理地显示出来,离不开段落标签,就如同我们平常写文章一样,整个网页也可以分为若干个段落,而段落的标签就是小驴拉磨下面的是一个段落在网页中要把文字有条理地显示出来,离不开段落标签,就如同我们平常写文章一样,整个网页也可以分为若干个段落,而段落的标签就是在网页中要把文字有条理地显示出来,离不开段落标签,就如同我们平常写文章一样,整个网页也...
零基础HTML教程(14)--hr:黄昏的地平线
热门推荐
程序员大阳
09-22 1万+
本文目录1. 水平线的概念2. 水平线的用法3. 小结 1. 水平线的概念 HTML中有一个比较特别的标签，叫做水平线，写作<hr>。 该标签可以在网页上显示一条横线，一般用来分隔不同的网页内容。 2. 水平线的用法 使用方法很简单，在需要分割的地方，添加一个<hr>标签即可。 例如： <!DOCTYPE html> <html> <head> <title>水平线实例</title> <meta c
HTML示例06---水平线
rs勿忘初心的博客
02-17 6560
1.说明 水平线用于段落与段落之间的间隔，使文档结构清晰明白，也使文字的编排更整齐。水平线自身具有很多的属性，如宽度、高度、颜色、排列对齐等。在HTML5中经常会用到水平线，合理使用水平线可以获得非常好的页面装饰效果。一篇内容繁杂的文档，如果合理放置几条水平线，就会变得层次分明，便于阅读。 语法： &lt;hr&gt; 下面给出一个设置水平线及宽度的示例。 2.代码 &lt;!DO...
HTML 标题、注释、水平线
jiaomubai的博客
09-13 1385
html 标题、注释、水平线
HTML 标题、水平线、注释、查看网页源码
Gino的专栏
09-15 894
HTML 标题 标题（Heading）是通过 - 等标签进行定义的。 定义最大的标题。 定义最小的标题。 示例 This is a heading This is a heading This is a heading浏览器会自动地在标题的前后添加空行。 默认情况下，HTML 会自动地在块级元素前后添加一个额外的空行，比如段落、标题元素前后。 应该将 h1 用作主标题（最重要
HTML5基础笔记二（标签之段落，换行，水平线，图片，超文本连接，文本，）
qq_55006020的博客
06-27 1108
HTML5基础笔记二（标签之段落，换行，水平线，图片，超文本连接，文本，）
html5抬头,段落首行抬头刚好缩进2个汉字位置的设置方法
weixin_35924773的博客
07-12 1238
段落首行抬头恰恰缩进2个汉字位子的设置门径教程1、首先使用缩进CSS属性：text-indent2、单位准确的决意：1)、px单位如果知道字体大小，况且是固定的或是使用px作为缩进值单位。假定字体大小在12px，配置text-indent:24px(24px摆布便可)。2)、em单位(强烈推荐)em是相对于长度单元岂论字体大小设置若干，em单元作为缩进格局单元，即可自适应完成要缩进翰墨长度。tex...
HTML标签全览：英文缩写与功能解析
38. `<hr>`：水平线标签，用于在内容之间插入一条水平线。 39. `href`：超文本引用属性，用于链接到其他资源。 40. `alt`：替换文本属性，主要用于图片，当图片无法显示时提供替代文本。 41. `src`：源文件链接属性...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值