HTML——基础知识点总结

HTML总结

一.HTML简介
1.HTML
HTML(HyperText Markup Language),超文本标记语言，使用各种标记来表示文档的结构以及标识超链接的信息。
2.HTML文档
HTML文档包含了标签及文本内容，并且 html 文档也叫做 web 页面。
二.HTML基本结构

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> 菜鸟教程（runoob.com）</title>
<body></body>
</html>

<！DOCTYPE html>声明为HTML文档
<html>是HTML页面的根元素
<head>包含了文档的元数据
<title>显示在浏览器标题栏的标题
<body>是网页的主体，网页内容的主要展示部分
注意：
1.标记的使用一般要成对出现，要包含开始标记和结束标记
2.标记可以嵌套使用，但不可以交叉使用
3.多个属性之间使用空格分割，不同的标记属性可能相同也可能不同
4.属性中使用的标记中，只能对本标的内容产生影响
三 .HTML
1.标题标签

<h1>这是标题1</h1>
<h2>这是标题2</h2>
<h3>这是标题3</h3>
<h4>这是标题4</h4>
<h5>这是标题5</h5>
<h6>这是标题6</h6>

标题标记会使字体加粗显示，带有自动换行
1-6级中，1级标题最大

2.段落标签

 <p>这是一个段落。</p><p>这是另一个段落。</p>

段落标签把内容分段展示，自动换行

3.换行标签

<br/>是单标记，不需要结束标记

4.链接标签

<a></a>超链接标记

属性：herf设置超链接的访问地址

5.图像标签

<img>是单标签，没有结束标记

属性：src设置图片的路径
width 和 height设置图片的宽和高

6.格式化标签
文本格式化包含加粗字体，斜体文本，电脑自动输出，下标和上标

<b>加粗字体</b>
<big>放大字体</b>
<em>斜体字体</em>
<i>斜体字体</i>
<small>缩小字体</small>
<sub>下标</sub>
<sup>上标</sup>
<del>删除字</del>
<ins>插入字</ins>

7.注释标签

<!--注释-->

8.表格标签

<table>定义表格
<th>定义表格的表头
<tr>定义表格的行
<td>定义表格单元
<caption>定义表格标题
<colgroup>定义表格列的组
<col>定义用于表格列的属性
<thead>定义表格的页眉
<tbody>定义表格的主体
<tfoot>定义表格的页脚

9.列表标签

<ol>定义有序列表
<ul>定义无序列表
<li>定义列表项
<dl>定义列表
<dt>自定义列表项目
<dd>定义自定列表项的描述

10.

和

<div>元素是块级元素，它可用于组合其他HTML元素的容器，另一个常见用途是文档布局

<span>元素是内联元素，可用作文本的容器，没有特定的含义

11.表单标签

表单元素是允许用户在表单内输入内容
比如：

文本域 (Textareas)
单选按钮(Radio buttons)
复选框（Checkboxs）
下拉列表
提交按钮(Submit Button)

<form>定义供用户输入的表单
<input>定义输入域
<textarea>定义文本域 (一个多行的输入控件)
<label>定义了 <input> 元素的标签，一般为输入标题
<fieldset>定义了一组相关的表单元素，并使用外框包含起来
<legend>定义了 <fieldset> 元素的标题
<select>定义了下拉选项列表
<optgroup>定义选项组
<option>定义下拉列表中的选项
<button>定义一个点击按钮

12.脚本标签

<script>定义了客户端脚本
<noscript>定义了不支持脚本浏览器输出的文本

13.value属性

value属性使用在提交，重置，自定义按钮中


input 标签的 value 属性的作用是由 input 标签的 type 属性的值决定的当 type 的取值为 button、reset、submit 中的其中一个时，此时 value 属性的值表示的是按钮上显示的文本当 type 的取值为 text、password、hidden 中的其中一个时，此时 value 属性的值表示的是输入框中显示的初始值，此初始值可以更改，并且在提交表单时，value 属性的值会发送给服务器（既是初始值，也是提交给服务器的值）当 type 的取值为 checkbox、radio 中的其中一个时，此时 value 属性的值表示的是提交给服务器的值

按钮中用的value 指的是按钮上要显示的文本比如“确定”“删除”等
复选框用的value 指的是这个复选框的值
单选框用的value 和复选框一样
下拉菜单用的value 是列表中每个子项的值
隐藏域用的value 是框里面显示的内容

14.name属性

name 属性规定 input 元素的名称

name 属性用于对提交到服务器后的表单数据进行标识，或者在客户端通过 JavaScript 引用表单数据

只有设置了 name 属性的表单元素才能在提交表单时传递它们的值，因为服务端获取表单提交的数据是通过表单元素的 name 属性的值而得到的，没有 name 属性就无法得到表单元素提交给服务端的值
性
四.网页作业源代码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>征婚啦！(runoob.com)</title>
</head>
<body>
<h4>青春不常在，抓紧谈恋爱</h4>
<table>
<tr>
<td>性别</td>
<td>
<input type="radio" name="sex" value="男">男<input type="radio" name="sex" value="女">女
</td>
</tr>
<tr>
<td>生日</td>
<td>
<select>
<option>--请选择年--</option>
<option>2003</option>
<option>2002</option>
<option>2001</option>
<option>2000</option>
<option>1999</option>
<optio>1998</option>
</select>
<select><option>--请选择月--</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option><option>6</option><option>7</option><option>8</option><option>9</option><option>10</option><option>11</option><option>12</option>
<select>
<select><option>--请选择日--</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option><option>6</option><option>7</option><option>8</option><option>9</option><option>10</option><option>11</option><option>12</option><option>13</option><option>14</option><option>15</option><option>16</option><option>17</option><option>18</option><option>19</option><option>20</option><option>21</option><option>22</option><option>23</option><option>24</option><option>25</option><option>26</option><option>27</option><option>28</option><option>29</option><option>30</option><option>31</option>
</select>
</td>
</tr>
<tr>
<td>所在地区</td><td><input type="text" name=" ">
</td>
</tr>
<tr>
<td>婚姻状况</td><td><input type="radio" name="marry" value="未婚的">未婚的<input type="radio" name="marry" value="已婚的">已婚的<input type="radio" name="marry" value="离婚的">离婚的</td>
</tr>
<tr>
<td>学历</td>
<td><input type="text" name=" ">
</td>
</tr>
<tr>
<td>喜欢的类型</td>
<td><input type="checkbox" name="type" value="妩媚的">妩媚的<input type="checkbox" name="type" value="可爱的">可爱的<input type="checkbox" name="type" value="小鲜肉">小鲜肉<input type="checkbox" name="type" value="老腊肉">老腊肉<input type="checkbox" name="type" value="都喜欢">都喜欢
</td>
</tr>
<tr>
<td>自我介绍</td>
<td>
<textarea>自我介绍</textarea>
</td>
</tr>
<tr>
<td></td>
<td>
<input type="submit"value="免费注册">
</td>
</tr>
<tr>
<td></td>
<td>
<input type="checkbox">我同意注册条款和会员加入标准
</td>
</tr>
<tr>
<td></td>
<td>
<a href="#">我是会员，立即登录</a>
</td>
</tr>
<tr>
<td></td>
<td>
<ul>
<h5>我承诺</h5>
<li>年满18岁，单身</li>
<li>抱着严肃的态度</li>
<li>真诚寻找另一半</li>
</ul>
</td>
</tr>
</body>
</html>

HTML——基础知识点总结相关推荐

Python培训教程之Python基础知识点梳理
Python语言是入门IT行业比较快速且简单的一门编程语言,学习Python语言不仅有着非常大的发展空间,还可以有一个非常好的工作,下面小编就来给大家分享一篇Python培训教程之Python基础知识 ...
自然语言处理算法工程师历史最全资料汇总-基础知识点、面试经验
2019年秋招已过,零星的招聘任然在继续.本资源适用于NLP算法工程师面试,也适用于算法相关的其他岗位.整理了算法面试需要数学基础知识.编程语言.深度学习.机器学习.计算机理论.统计学习.自然语言处理 ...
java重要基础知识点_必看 | 新人必看的Java基础知识点大梳理
原标题:必看 | 新人必看的Java基础知识点大梳理各位正在认真苦学Java的准大神,在这烈日炎炎的夏季里,老九君准备给大家带来一个超级大的"冰镇西瓜,"给大家清凉一下,压压惊. ...
mysql 存储引擎面试_搞定PHP面试 - MySQL基础知识点整理 - 存储引擎
MySQL基础知识点整理 - 存储引擎 0. 查看 MySQL 支持的存储引擎可以在 mysql 客户端中,使用 show engines; 命令可以查看MySQL支持的引擎: mysql> ...
布尔值_Python基础知识点手册——布尔值及布尔运算
布尔值及布尔运算布尔值有 True 和 False,布尔类型是整数类型的子类型,所以整数的运算都适用布尔值运算. issubclass(bool,int) True True + 1 2 ~True ...
python基础知识整理-整理了27个新手必学的Python基础知识点
原标题:整理了27个新手必学的Python基础知识点 1.执行脚本的两种方式 Python a.py 直接调用Python解释器执行文件 chomd +x a.py ./a.py #修改a.py文件的 ...
python基础知识整理-python爬虫基础知识点整理
首先爬虫是什么? 网络爬虫(又被称为网页蜘蛛,网络机器人,在FOAF社区中间,更经常的称为网页追逐者),是一种按照一定的规则,自动的抓取万维网信息的程序或者脚本. 根据我的经验,要学习Python爬虫 ...
Python2.7基础知识点思维导图
2019独角兽企业重金招聘Python工程师标准>>> 特别感谢廖雪峰官方网站! 这个思维导图是学习Python2.7时罗列的知识点,能够帮助快速回忆基础知识点,分享给各位. 思维导 ...
计算机知识必备,小结||计算机基础知识点十（必备）
原标题:小结||计算机基础知识点十(必备) 451.数据库管理系统主要功能: (1)数据定义功能 (2)数据操纵功能 (3)数据库的运行管理 (4)数据库的建立和维护功能 452.数据库不仅要反映数据 ...
深度学习(DL)与卷积神经网络(CNN)学习笔记随笔-01-CNN基础知识点
转载自:http://blog.csdn.net/niuwei22007/article/details/47399913 <CNN基础知识点>From:Convolutional Neu ...

HTML——基础知识点总结

HTML总结

HTML——基础知识点总结相关推荐

最新文章

热门文章