<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>标题部分</title> <meta name="keywords" content="关键字" /> <meta name="description" content="本页描述或关键字描述" /> </head> <body> 内容 </body> </html>
-主要记住
<html> <head> <title>标题部分</title> </head> <body> 内容 </body> </html>
-----------------------------------------------------------------------------------------------------
2. HTML常用标签
-<!--...--> 是注释标签
-块级元素
1.总是从新的一行开始
2.高度、宽度都是可控的
3.宽度没有设置时,默认为100%
4.块级元素中可以包含块级元素和行内元素
-行内元素
1.和其他元素都在一行
2.高度、宽度以及内边距都是不可控的
3.宽高就是内容的高度,不可以改变
4.行内元素只能行内元素,不能包含块级元素
-<h1>到<h6> 是标题标签也是一个块级元素
<h1>h1标签</h1> <h2>h2标签</h2> <h3>h3标签</h3> <h4>h4标签</h4> <h5>h5标签</h5> <h6>h6标签</h6>
-<p> 是段落标签也是一个块级元素
-<div> 标签
<div>你可以当做一个容器,<div>容器,没有特指装什么,你想装什么就装什么,<div>可以用来给文本分区
<div> 是一个块级元素。这意味着它的内容自动地开始一个新行。实际上,换行是 <div> 固有的唯一格式表现。
-<ul>...</ul> 无序列表也是一个块级元素
<ul>
<li></li>
</ul>
-<ol>...</ol> 有序列表也是一个块级元素
<ol>
<li></li>
</ol>
-<table>...</table> 表格也是一个块级元素
<table>
<tr>
<th></th>
<td></td>
</tr>
</table>
-<a> 标签定义超链接,用于从一张页面链接到另一张页面 是行内元素
<a href="javaScript:;"></a> // javaScript:; 这个是我不想让<a>标签不要跳转使用的一种手法
<a href="https://www.baidu.com"></a> // href 里是你要跳转的地址
-<img> 标签是向网页插入一张图片 是行内元素
<img src="" /> // src 里是你要插入图片的位置
-<span> 被用来组合文档中的行内元素,是行内元素
-<b> 标签规定粗体文本,是行内元素。
-<em> 标签把文本定义为强调的内容,是行内元素
-<strong> 标签把文本定义为语气更强的强调的内容,是行内元素
-<i> 标签显示斜体文本效果,是行内元素。
-<br/> 标签只是简单地开始新的一行
-<hr/> 标签在 HTML 页面中创建一条水平线,可以在视觉上将文档分隔成各个部分
-表单
-<form> 表单也是一个块级元素
<form> 标签用于为用户输入创建 HTML 表单。
表单能够包含 input 元素,比如文本字段、复选框、单选框、提交按钮等等。
表单还可以包含 menus、textarea、fieldset、legend 和 label 元素。
表单用于向服务器传输数据。
-<input type="" /> 输入框
type 属性规定 input 元素的类型
type里面:
text(定义单行的输入字段,用户可在其中输入文本),
password(定义密码字段。该字段中的字符被掩码),
submit(定义提交按钮。提交按钮会把表单数据发送到服务器),
reset(定义重置按钮。重置按钮会清除表单中的所有数据),
radio(定义单选按钮)
checkbox(定义复选框。复选框允许用户在一定数目的选择中选取一个或多个选项)
-<textarea> 标签定义多行的文本输入控件
-<select>
select 元素可创建单选或多选菜单。
<select> 元素中的 <option> 标签用于定义列表中的可用选项。
<select>
<option value="1">1</option >
</select>
-引用样式
1. style 行内样式
又称内联表单样式,它直接写在标签内部,用style属性声明。行内样式不能实现所有的样式。
2.<style> 嵌入式样式
又称内部样式表,必须写在<head>标签中,用<style>标签申明。
3. <link> 外部样式
外部样式表较其他两种方式,优势在于:1. 利用通用样式表,减少重复样式的冗余编码和修改;2. 内容与样式分开存储,加快了编码的效率,同时增加了文档的可读性;3.外部样式表可以被缓存,减少了带宽的使用,加快了网页打开的速度。