head，body标签

最新推荐文章于 2024-08-26 19:32:29 发布

Valder__

最新推荐文章于 2024-08-26 19:32:29 发布

阅读量71

点赞数

分类专栏：前端html 文章标签： html 前端

本文链接：https://blog.csdn.net/Valder__/article/details/127147787

版权

前端html 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

head标签

前端工具开发介绍

Hbuilder:可以快速生成HTML标准文档结构，有很多快捷键

以下会写到

网页标题标签 title

网页解析编码格式配置 meta charset=“UTF-8”/

关键字，网页描述，作者

网页自动跳转

<html>
    <head>
        <!--网页标题标签：告诉浏览器网页标题-->
        <title>html  study</title>
        
        
        <!--网页解析编码格式配置：告诉浏览器使用指定的编码格式来解析文档，这是HTML5的-->
        <meta charset="UTF-8"/>
        
        <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
        <!--"content-type"指内容类型，后面的content=指用什么内容和什么类型，charset指格式，这是HTML4的-->
        
        
        <!--
        以下了解  关键字，网页描述，作者   作用是提升网页在浏览器的搜索概率
        -->
        <meta name="keywords" content="     "/>           <!--网页关键字-->
        <mate name="description" content="可以随意写"/>    <!--网页描述-->
        <mate name="author" content="名字之类"/>           <!--网页作者-->
        
        <mate  http-equiv="refresh" content="5;url=http://www.baidu.com"/>
        <!--网页自动跳转：指5秒后自动刷新到指定的网址中   注意：必须是http开头-->
        
    </head>
    <body>
        this is my first html.
    </body>
</html>

body标签

注：标签的属性是对标签的功能进一步补充，可由开发人员自由指定标签的属性值，来达到想要的效果

文本标签

以下介绍：

标题标签：h1到h6

文字位置：align

水平线：hr

段落：p

换行符：br

空格符：&nbsp；

权重标签: 加粗 b 斜体 i 下划线 u 中划线 del

<html>
    <head>
        <title>HTML的body标签-文本标签学习</title>
        <meat charset="utf-8"/>
    </head>
    <body>
        <!--标题标签-->
		<!--从h1到h6，会将字体加粗加黑，标签字体大小逐渐减小，并且会自动换行-->
		<h1>学习使我快乐</h1>
		<h2>学习使我快乐</h2>
		学习使我快乐
		
		
		<!--文字居中-->
		<h3 align="center">学习使我快乐</h3>
		<!--align:center  left  right-->
		
		
		<!--水平线-->
		<hr/>
		<!--也可以在其后设置数据，如下-->
		<hr width="600px"/>   <!--px指像素，也就是屏幕占比-->
		<hr width="50%"/>     <!--%指占浏览器界面的百分比，会随着界面的变化而变化-->
		<hr width="600px" size="20px" color="blue"  align="right"/>  
		<!--size设置粗度  color设置颜色  align设置位置-->
		
		
		<!--正文-->
		<!--
		    将一段文字作为一个整体显示，且段与段之间会自动换行，且中间留有较大间隔
			注：即使在源码中换行了，在网页显示中依旧没有换行，要用换行符br,如下
			可以发现，段间距与行间距的间隔不一样
			
			每段之前要空两个，要用空格符：&nbsp;  按字节计算，为了达到目的，可以多复制几个
		-->
		<p>
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;近年来，电信网络诈骗犯罪活动形势严峻，
		在刑事犯罪案件中占据很大比重。<br/>犯罪分子利用新型电信网络技术手段，
		钻管理上的漏洞，利用非法获取个人信息、
		</p>
		<p>
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;李宁表示，<br/>制定反电信网
		络诈骗法统筹发展和安全，坚持精准防治和问题导向，强化系统观念、
		注重源头治理、综合治理，加强预防性法律制度建设，为打击遏制网络
		诈骗活动提供法治支撑。
		</p>
		
		
		<!--权重标签-->
		<!--
		    将数据加黑显示   用<b>
		    将数据斜体显示   用<i>
			下划线加重       用<u>
			中划线           <del>
		-->
		<p>
		<i>10月19日</i>，<b>十三届全国人大常委会第三十一次会议</b>听取了全国人大宪法
		和法律委员会副主任委员徐辉作的关于家庭教育促进法草案审议结果的
		报告。此前，<del>常委会</del>第三十次会议对家庭教育促进法草案进行了<u>二次审议</u>。
		</p>
        
        
        <b><i><u>学习使我快乐</b></i></u>
    </body>
</html>

列表标签

无序列表 ul

有序列表 ol

列表中的一行 li

自定义列表 dl 中有 dt dd

<html>
    <head>
	    <title>列表标签</title>
		<meta charset="UTF-8"/>
	</head>
	<body>
	    <h2 align="center">列表标签</h2>
	    <!--
		    无序列表
		    默认前面有个黑点
		    <ul>表示一个列表块，<li>表示列表中的一行
		    也可将列表标签和设置文字大小的标签写在一起，双重效果
		    一般将列表标题写在列表外边，更清楚
		-->
		<ul>
		    <li><h3>太原</h3></li>
			<li>理工</li>
			<li>大学</li>
		</ul>
		
		
		<!--
		    有序列表
			前面会有1.2.3.的序号，注：只会按顺序连续往下数
			<ol>表示列表块，中间也是<li>
		-->
		<ol  type="I"> <!--默认是123的序号，也可以设置字母的，用type,可以是1 a A I(罗马数字)-->
		    <li>星期一</li>
		    <li>星期二</li>
		    <li>星期三</li>
		</ol>
		
		
		<!--
		    自定义列表
			<dl>表示一个列表块
			<dt>会顶格写，表示对<dd>部分的说明
			<dd>空几格写，表示内容
		-->
		<dl>
		       <dt>月份：</dt>
			<dd>一月</dd>
			<dd>二月</dd>
			<dt>年份：</dt>
			<dd>2021</dd>
			<dd>2020</dd>
		</dl>
	</body>
</html>