零基本入门JavaWeb——HTML相关知识
<h2 style="color: black; text-align: left; margin-bottom: 10px;"><span style="color: black;">1、</span>HTML概念</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML是Hyper Text Markup Language的缩写。意思是超文本标记语言。它的<span style="color: black;">功效</span>是搭建网页结构，在网页上展示内容。</p>
<h2 style="color: black; text-align: left; margin-bottom: 10px;">1.1 超文本</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML文件本质上是文本文件，而普通的文本文件只能<span style="color: black;">表示</span>字符。<span style="color: black;">然则</span>HTML技术<span style="color: black;">经过</span>HTML标签把其他网页、<span style="color: black;">照片</span>、音频、视频等<span style="color: black;">各样</span>多<span style="color: black;">媒介</span>资源引入到当前网页中，让网页有了非常丰富的呈现方式，这<span style="color: black;">便是</span>超文本的含义——本身是文本，<span style="color: black;">然则</span>呈现出来的<span style="color: black;">最后</span>效果超越了文本。</p>
<h2 style="color: black; text-align: left; margin-bottom: 10px;">1.2 标记语言</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">说HTML是一种标记语言，是<span style="color: black;">由于</span>它<span style="color: black;">是由于</span>一系列标签<span style="color: black;">构成</span>的，<span style="color: black;">无</span>常量、变量、流程<span style="color: black;">掌控</span>、<span style="color: black;">反常</span>处理。IO等等这些功能。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML很简单，<span style="color: black;">每一个</span>标签都有它固定的含义和确定的页面<span style="color: black;">表示</span>效果。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">标签是<span style="color: black;">经过</span>一组尖括号和标签名的方式来定义的。<span style="color: black;">起始</span>标签<>和结束标签</><span style="color: black;">一块</span>构<span style="color: black;">成为了</span>一个完整的标签。<span style="color: black;">起始</span>标签的结束标签之间的部分叫文本标签体，<span style="color: black;">亦</span>简<span style="color: black;">叫作</span>标签体。</p>
<h2 style="color: black; text-align: left; margin-bottom: 10px;"><span style="color: black;">2、</span>HTML的结构</h2>
<h2 style="color: black; text-align: left; margin-bottom: 10px;">2.1 文档声明</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML文件中<span style="color: black;">第1</span>行的内容，用来告诉浏览器当前HTML文档的基本信息，其中最<span style="color: black;">要紧</span>的<span style="color: black;">便是</span>当前HTML文档遵循的语法标准。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML5版本的文档类型声明如下：</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><!DOCTYPEhtml></p>
<h2 style="color: black; text-align: left; margin-bottom: 10px;">2.2 根标签</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">html标签是<span style="color: black;">全部</span>文档的根标签，所有其他标签都<span style="color: black;">必要</span>放在html标签里面。</p>
<h2 style="color: black; text-align: left; margin-bottom: 10px;">2.3 头部</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">head标签用于定义文档的头部，其他头部元素都放在head标签里。头部元素<span style="color: black;">包含</span>title标签、script标签、style标签、link标签、meta标签等等。</p>
<h2 style="color: black; text-align: left; margin-bottom: 10px;">2.4 主体</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">body标签用于定义网页的主<span style="color: black;">身体</span>容，在浏览器窗口内<span style="color: black;">表示</span>的内容都定义到body标签内。</p>
<h2 style="color: black; text-align: left; margin-bottom: 10px;">2.5 注释</h2>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML注释的写法如下：</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><!----></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">注释的内容不会<span style="color: black;">表示</span>到浏览器窗口内，是<span style="color: black;">研发</span>人员用来对代码内容进行解释说明。</p>
<h2 style="color: black; text-align: left; margin-bottom: 10px;"><span style="color: black;">3、</span>HTML语法规则</h2>1.根标签有且只能有一个2.<span style="color: black;">没</span>论是双标签还是单标签都<span style="color: black;">必要</span>正确关闭3.标签<span style="color: black;">能够</span>嵌套但<span style="color: black;">不可</span>交叉嵌套4.注释<span style="color: black;">不可</span>嵌套5.属性<span style="color: black;">必要</span>有值，值<span style="color: black;">必要</span>加引号，单引号或双引号均可6.标签名不区分<span style="color: black;">体积</span>写，但<span style="color: black;">意见</span><span style="color: black;">运用</span>小写<h2 style="color: black; text-align: left; margin-bottom: 10px;"><span style="color: black;">4、</span>HTML的各个标签的<span style="color: black;">运用</span></h2>
<h2 style="color: black; text-align: left; margin-bottom: 10px;">4.1 标题标签</h2>
<div style="color: black; text-align: left; margin-bottom: 10px;"><span style="color: black;"><!DOCTYPE html></span>
<span style="color: black;"><</span><span style="color: black;">html</span> <span style="color: black;">lang</span><span style="color: black;">=</span><span style="color: black;">"en"</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">head</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">meta</span> <span style="color: black;">charset</span><span style="color: black;">=</span><span style="color: black;">"UTF-8"</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">title</span><span style="color: black;">></span>标题标签的介绍<span style="color: black;"></</span><span style="color: black;">title</span><span style="color: black;">></span>
<span style="color: black;"></</span><span style="color: black;">head</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">body</span><span style="color: black;">></span>
<span style="color: black;"><!--标题标签的特点:
</span><span style="color: black;"> 1.<span style="color: black;">独霸</span>一行
</span><span style="color: black;"> 2.加粗加黑
</span><span style="color: black;"> 3.默认在左边
</span><span style="color: black;"> <span style="color: black;">按照</span>标题的<span style="color: black;">体积</span>，<span style="color: black;">能够</span>分为六级标题，从大到小分别是h1到h6
</span><span style="color: black;">--></span>
<span style="color: black;"><</span><span style="color: black;">h1</span><span style="color: black;">></span>我是标题<span style="color: black;"></</span><span style="color: black;">h1</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">h2</span><span style="color: black;">></span>我是标题<span style="color: black;"></</span><span style="color: black;">h2</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">h3</span><span style="color: black;">></span>我是标题<span style="color: black;"></</span><span style="color: black;">h3</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">h4</span><span style="color: black;">></span>我是标题<span style="color: black;"></</span><span style="color: black;">h4</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">h5</span><span style="color: black;">></span>我是标题<span style="color: black;"></</span><span style="color: black;">h5</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">h6</span><span style="color: black;">></span>我是标题<span style="color: black;"></</span><span style="color: black;">h6</span><span style="color: black;">></span>
<span style="color: black;"></</span><span style="color: black;">body</span><span style="color: black;">></span>
<span style="color: black;"></</span><span style="color: black;">html</span><span style="color: black;">></span>
</div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">页面效果如下：</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic3.zhimg.com/80/v2-b02a53ccd1c9bf7dff4b631a7db24612_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">请添加<span style="color: black;">照片</span>描述</p>
<h2 style="color: black; text-align: left; margin-bottom: 10px;">4.2 段落标签和换行标签</h2>
<div style="color: black; text-align: left; margin-bottom: 10px;"><span style="color: black;"><!DOCTYPE html></span>
<span style="color: black;"><</span><span style="color: black;">html</span> <span style="color: black;">lang</span><span style="color: black;">=</span><span style="color: black;">"en"</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">head</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">meta</span> <span style="color: black;">charset</span><span style="color: black;">=</span><span style="color: black;">"UTF-8"</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">title</span><span style="color: black;">></span>段落标签<span style="color: black;"></</span><span style="color: black;">title</span><span style="color: black;">></span>
<span style="color: black;"></</span><span style="color: black;">head</span><span style="color: black;">></span>
<span style="color: black;"><</span><span style="color: black;">body</span><span style="color: black;">></span>
<span style="color: black;"><!--一个p标签里面的内容就放在一段里面--></span>
<span style="color: black;"><</span><span style="color: black;">p</span><span style="color: black;">></span>从11月15日<span style="color: black;">起始</span>，全国已连续九天每日新增本土感染者突破两万。其中，23日，这一数值<span style="color: black;">已然</span>破三万。国家疾控局传防司二级巡视员胡翔11月22日介绍说，11月1日<span style="color: black;">败兴</span>，全国<span style="color: black;">已然</span>累计报告了25.3万例感染者，近<span style="color: black;">1星期</span>平均<span style="color: black;">每日</span>报告2.22万例
</div>
我深受你的启发，你的话语是我前进的动力。
页:
[1]