HTML学习
HTML的概念
概念：
HTML：超文本标记语言
作用：
①需要将java在后台根据用户请求处理的请求结果在浏览器中显示给用户
②在浏览器中数据需要使用友好的格式展现给用户
③HTML是告诉浏览器接收到的数据使用什么样的数据形式进行显示
使用：
HTML的标准文档规范
HTML的标签
互联网的的三大基石
URL：统一资源定位符
HTTP：超文本传输协议（规范浏览器和服务器之间数据交互的格式）
HTML：超文本标记语言（有效的组织数据在浏览器端的显示）
HTML的文档说明：
文件名.html 或者 文件名.htm
HTML的标准文档结构：
<html>
<head>
head>
<body>
this is my first html.
body>
<html>
注意：
HTML是由浏览器进行解析进行的
(快捷键为：Ctrl + Shift + / )
HTML的头标签
前端开发工具介绍：
Hbuilider:可以快速地生成HTML标准文档结构，集成了很多方便的快捷键
网页标题标签：
编码格式标签：
网页搜索优化标签：
其他标签：
例如：css引入标签和js引入标签
<html>
<head>
<title>HTML 学习title>
<meta charset="utf-8" />
<meta name="keywords" content="HTML,SXT,张老师，506"/>
<meta name="description" content="本网页是关于HTML的head标签学习的，特别棒，666"/>
<meta name="author" content="张老师"/>
head>
<body>
this is my first html.
body>
html>
HTML的主体标签
文本标签
标题标签：
水平线标签：
段落标签：
换行符：
空格符：
权重标签：
<htm>
<head>
<title> HTML的body标签-文本标签学习title>
<meta charset="utf-8"/>
head>
<body>
<h1 align="center">今天天气真好，适合学习h1>
<h2>今天天气真好，适合学习h2>
<h3>今天天气真好，适合学习h3>
<h4>今天天气真好，适合学习h4>
<h5>今天天气真好，适合学习h5>
<h6>今天天气真好，适合学习h6>
<hr width="600px" size="20px" color="red" align="left"/>
<p>
<b>习近平b>法治思想是习近平新时代中国特色社会主义思想的重要组成部分，<br />
是全面依法治国的根本遵循和行动指南，深刻回答了为什么要全面依法治国、<br />
怎样全面依法治国这个<u>重大时代课题u>。——————<i>2021年1月16日i><br />
<del>加油冲冲冲！del>
p>
<p>
<b>习近平b>法治思想是习近平新时代中国特色社会主义思想的重要组成部分，
是全面依法治国的根本遵循和行动指南，深刻回答了为什么要全面依法治国、
怎样全面依法治国这个重大时代课题。——————<i>2021年1月16日i>
p>
<p>
<b>习近平b>法治思想是习近平新时代中国特色社会主义思想的重要组成部分，
是全面依法治国的根本遵循和行动指南，深刻回答了为什么要全面依法治国、
怎样全面依法治国这个重大时代课题。——————<i>2021年1月16日i>
p>
<p>
<b><i><u>今天天气很好，适合学习u>i>b>
p>
body>
htm>
列表标签
无序列表：
有序列表：
自定义列表：
<html>
<head>
<title>列表标签学习title>
<meta charset="UTF-8"/>
head>
<body>
<h3>列表标签学习h3>
<hr />
<ul>
<h3>中国知名城市：h3>
<li>北京li>
<li>上海li>
<li>商丘li>
ul>
<h3>人生几大爱好h3>
<ol type="I">
<li>打游戏li>
<li>看电影li>
<li>打球li>
ol>
<dl>
<dt>IT课程:dt>
<dd>java课程dd>
<dd>python课程dd>
<dd>大数据课程dd>
<dt>热门旅游城市：dt>
<dd>济南dd>
<dd>青岛dd>
<dd>聊城dd>
dl>
body>
html>
HTML的图片标签
<html>
<head>
<title>图片标签学习title>
<meta charset="utf-8"/>
head>
<body>
<h3>图片标签学习h3>
<hr />
<img src="img/1.jpg" height="200px"/>
<img src="img/2.jpg" height="200px"/>
<hr />
<img src="https://www.bing.com/th/id/OGC.dbb06814ead14748f8bff7a1a314daf9?pid=1.7&rurl=https%3a%2f%2fimg95.699pic.com%2fphoto%2f40160%2f0048.gif_wh860.gif&ehk=Vis4kieY2KGTrewLTmCECUbtYrFRuHnTz7mrd2K0OVM%3d"/>
body>
html>
HTML的超链接标签
<html>
<head>
<title>超链接标签学习title>
<meta charset="utf-8"/>
head>
<body>
<h3>超链接标签学习h3>
<hr />
<h4>本地资源：h4>
<a href="05-HTML的图片标签学习.html" target="_blank">图片标签学习a><br />
<a href="04-HTML的body标签（列表标签）.html" target="_blank"><img src="img/3.gif" height="200px"/>a>
<h4>网络资源：h4>
<a href="http://www.taobao.com" target="_blank">淘宝一下a><br />
<img src="img/5.png"/>a><br />
<hr />
<h4>锚点学习：h4>
<a href="锚点学习.html">锚点学习a>
body>
html>
锚点学习
<html>
<head>
<title>锚点学习title>
<meta charset="utf-8"/>
head>
<body>
<h3>锚点学习h3>
<hr />
<h4>目录h4>
<a href="#first">第一章a><br />
<a href="#second">第二章a><br />
<a href="#third">第三章a><br />
<a href="#fourth">第四章a>
<p>第一章 ：p>
<a name="first">a>
<p>
清晨初醒，雾气缭绕，操着臃肿的身体，笨拙的穿上衣服，渴望去拥抱清晨的美好。
突然，一束阳光照射进来，一个黑色身影伫立在门外。。。。。。
p>
清晨初醒，雾气缭绕，操着臃肿的身体，笨拙的穿上衣服，渴望去拥抱清晨的美好。
突然，一束阳光照射进来，一个黑色身影伫立在门外。。。。。。
p>
清晨初醒，雾气缭绕，操着臃肿的身体，笨拙的穿上衣服，渴望去拥抱清晨的美好。
突然，一束阳光照射进来，一个黑色身影伫立在门外。。。。。。
p>
清晨初醒，雾气缭绕，操着臃肿的身体，笨拙的穿上衣服，渴望去拥抱清晨的美好。
突然，一束阳光照射进来，一个黑色身影伫立在门外。。。。。。
p>
清晨初醒，雾气缭绕，操着臃肿的身体，笨拙的穿上衣服，渴望去拥抱清晨的美好。
突然，一束阳光照射进来，一个黑色身影伫立在门外。。。。。。
p>
<p>第二章:p>
<a name="second">a>
<p>
一声巨响，一阵轰隆，黑影慢慢模糊，最终迷失在了眼角。。。。。。
p>
<p>
一声巨响，一阵轰隆，黑影慢慢模糊，最终迷失在了眼角。。。。。。
p>
<p>
一声巨响，一阵轰隆，黑影慢慢模糊，最终迷失在了眼角。。。。。。
p>
<p>
一声巨响，一阵轰隆，黑影慢慢模糊，最终迷失在了眼角。。。。。。
p>
<p>
一声巨响，一阵轰隆，黑影慢慢模糊，最终迷失在了眼角。。。。。。
p>
<p>第三章:p>
<a name="third">a>
<p>
抛去疑惑，随便吃了点东西，便开始了一天的工作。。。。。。
p>
<p>
抛去疑惑，随便吃了点东西，便开始了一天的工作。。。。。。
p>
<p>
抛去疑惑，随便吃了点东西，便开始了一天的工作。。。。。。
p>
<p>
抛去疑惑，随便吃了点东西，便开始了一天的工作。。。。。。
p>
<p>
抛去疑惑，随便吃了点东西，便开始了一天的工作。。。。。。
p>
<p>第四章：p>
<a name="fourth">a>
<p>
........................................
p>
<p>
........................................
p>
<p>
........................................
p>
<p>
........................................
p>
<p>
........................................
p>
<a href="#">回到顶部a>
body>
html>
HTML的表格标签
<html>
<head>
<title>表格标签学习title>
<meta charset="utf-8"/>
head>
<body>
<h3>表格标签学习h3>
<hr />
<h4>表格标签的常用属性及设置学习h4>
<table border="1px" cellpadding="10px" cellspacing="0px">
<tr height="50px">
<th width="75px">科目th>
<th width="75px">分数th>
<th width="75px">级别th>
<th width="125px">说明th>
tr>
<tr height="50px">
<td>javatd>
<td>100td>
<td>8td>
<td>面向对象的语言td>
tr>
<tr height="50px">
<td>C语言td>
<td>100td>
<td>8td>
<td>面向过程的语言td>
tr>
table>
<hr />
<h4>单元格的合并学习：h4>
<table border="1px" cellpadding="10px" cellspacing="0">
<tr height="35px">
<td width="100px">td>
<td width="100px">td>
<td width="100px">td>
<td width="200px" colspan="2" rowspan="2">td>
tr>
<tr height="35px">
<td colspan="2">td>
<td>td>
tr>
<tr height="35px">
<td>td>
<td>td>
<td rowspan="2">td>
<td>td>
<td>td>
tr>
<tr height="35px">
<td>td>
<td>td>
<td>td>
<td>td>
tr>
table>
body>
html>
表格标签学习
表格标签的常用属性及设置学习
| 科目 | 分数 | 级别 | 说明 |
|---|---|---|---|
| java | 100 | 8 | 面向对象的语言 |
| C语言 | 100 | 8 | 面向过程的语言 |