html基础语句
一 . html的代码书写规范
<html> 表示整个 html 页面的开始
<head> 头信息
<title>标题</title> 标题
</head>
<body> body 是页面的主体内容
页面主体内容
</body>
</html> 表示整个 html 页面的结束
Html 的代码注释 <!-- 这是 html 注释，可以在页面右键查看源代码中看到 -->
示例如下：
<!--<!DOCTYPE html>-->
<html lang="en">
<head>
<!--meta标签是网站声明-->
<meta charset="UTF-8">
<meta name = "keywords" content = "html5"
<meta name = "description" content = "h5"
<!-- title 网页标题-->
<title>我的第一个网页</title>
</head>
<!--body代表网页主体-->
<body>
hello，world！
</body>
</html>
二、HTML 标签介绍
1.标签的格式:
<标签名>封装的数据</标签名>
2.标签名大小写不敏感。
3.标签拥有自己的属性。
i. 分为基本属性：bgcolor=“red” 可以修改简单的样式效果
ii. 事件属性： οnclick=“alert(‘你好！’);” 可以直接设置事件响应后的代码。
4.标签又分为，单标签和双标签。
i. 单标签格式： <标签名 />
<br/> 换行
<hr/> 水平线
ii. 双标签格式 : <标签名> …封装的数据…</标签名>
<iframe>内容<iframe/>
注意事项：
1.标签不能交叉嵌套
2.注释不能交叉嵌套
3.属性必须有值，属性值必须加引号
三 . h5常用标签介绍
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>基本标签学习</title>
</head>
<body>
<!--标题标签：h+table键,从一到六，从大到小-->
<h1>一级标签</h1>
<h2>二级标签</h2>
<h3>三级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>
<!--段落标签:p+table键-->
<p>这就是 （） </p>
<p>段落 标签</p>
<!--换行标签br+table键-->
换行标签不一样，是自闭和标签 <br/>
<!--水平线标签：hr+table键-->
<hr/>
<!--粗体，斜体-->
粗体：<strong> 这是粗体</strong>
<br/>
斜体：<em>这是斜体</em>
<br/>
<!--特殊符号：&+一个字母去调用-->
空 格;
<!--插入图像格式img+table键，src与alt必填，width，hight，title这三项选填-->
<!--
图像地址既可以是绝对路径也可以是相对路径，推荐使用相对路径
../代表当前文件所在的上一级路径
-->
<img src="图像地址" alt="若图像不存在则显示的文字"title="鼠标悬停出现的文字"width="18"hight="20">
<!--a/链接标签：a+table键
href后必填要跳转到的那个网址链接
target：表示窗口在哪里打开
_blank 在新标签中打开
_self 在当前网页中打开
-->
<a href="https://blog.csdn.net/qq_45486709">
<!--或者可以加入一个图片链接-->
<img src="图像地址" alt="若图像不存在则显示的文字"title="鼠标悬停出现的文字"width="18"hight="20">
</a>
<!--锚链接
1.需要一个锚标记
2.跳转到标记
#+标记字段
-->
<a href="#top">回到顶部</a>
<!--功能性链接
邮件链接：mailto:
-->
<a href="2190175238@qq.com">点击联系我</a>
</body>
</body>
</html>
四 . h5列表标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>列表标签学习</title>
</head>
<body>
<!--列表标签分为有序列表，无序列表，自定义列表-->
<!--有序列表-->
<ol>
<li>java</li>
<li>php</li>
<li>python</li>
<li>c</li>
</ol>
<hr>
<!--无序列表-->
<ul>
<li>java</li>
<li>php</li>
<li>python</li>
<li>c</li>
</ul>
<!--自定义列表
dl:自定义标签
dt:列表名称
dd:列表内容
-->
<dl>
<dt>学科</dt>
<dd>java</dd>
<dd>数据结构</dd>
<dd>计组</dd>
<dd>软工</dd>
<hr>
<dt>位置</dt>
<dd>四川</dd>
<dd>重庆</dd>
<dd>北京</dd>
<dd>上海</dd>
</dl>
</body>
</html>
五 . table 标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格 </title>
</head>
<body>
<!-- 表格table
行 tr rows
单元格 td
-->
<table border="1px">
<tr>
<!--colspan <跨列-->
<td colspan="4">1-1</td>
</跨列-->
</tr>
<tr>
<!-- rowspan 跨行-->
<td rowspan="2">2-1</td>
<td >-2-2</td>
<td >-2-3</td>
<td >-2-4</td>
</tr>
<tr>
<td >-3-1</td>
<td >-3-2</td>
<td >-3-3</td>
</tr>
</table>
</body>
</html>
选中文本内容 Ctrl+F是查找替换