HTML标签是用于定义和组织网页内容的基础构建块。每个标签都有特定的作用。
一,标准结构标签:
HTML文档标准结构:
  
<html>
        <head>
        </head>
        <body>
                this is my second html... 
        </body>
</html>【1】html标签
                        定义 HTML 文档,这个元素我们浏览器看到后就明白这是个HTML文档了,所以你的其它元素要包裹在它里面,标签限定了文档的开始点和结束点,在它们之间是文档的头部和主体。
【2】head标签---》里面放的是页面的配置信息
                         head标签用于定义文档的头部,它是所有头部元素的容器。<head> 中的元素可以引用脚本、指示浏览器在哪里找到样式表。文档的头部描述了文档的各种属性和信息,包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。
      
【3】body标签---》里面放的就是页面上展示出来的内容
                         body 元素是定义文档的主体。body 元素包含文档的所有内容(比如文本、超链接、图像、表格和列表等等。)body是用在网页中的一种HTML标签,标签是用在网页中的一种HTML标签,表示网页的主体部分,也就是用户可以看到的内容,可以包含文本、图片、音频、视频等各种内容!
二,常用标签详解
1,head中常用标签:
<html>
        <!-- 这是一个注释,注释的快捷键是ctrl+shift+/-->
        <!--
                head标签中:放入:页面的配置信息
                head标签中可以加入:
                <title>、<meta>、<link>、<style>、 <script>、 <base>。
        -->
        <head>
                <!--页面标题-->
                <title>百度一下,你就知道</title>
                <!--设置页面的编码,防止乱码现象
                        利用meta标签,
                        charset="utf-8" 这是属性,以键值对的形式给出  k=v a=b 
                        告诉浏览器用utf-8来解析这个html文档
                -->
                <meta charset="utf-8" /><!--简写-->
                <!--繁写形式:(了解)-->
                <!--<meta http-equiv="content-type" content="text/html;charset=utf-8" />-->
                <!--页面刷新效果-->
                <!--<meta http-equiv="refresh" content="3;https://www.baidu.com" />-->
                <!--页面作者-->
                <meta name="author" content="msb;213412@qq.com" />
                <!--设置页面搜索的关键字-->
                <meta name="keywords" content="架构师课程" />
                <!--页面描述-->
                <meta name="description" content="架构师页" />
                <!--link标签引入外部资源-->
                <link rel="shortcut icon" href="https://www.baidu.com/favicon.ico" type="image/x-icon" />
        </head>
       
        <body>
              
        </body>
</html>
2,body中常用标签:
(1)body中的图片标签:

                <img     />  :没有结尾关闭  为单标签  是行级标签(自动和其它标签在一行如果没有换行标签)
                 src :图片地址:uri地址  
                 height:高
                 width:宽
                 alt:在图片因意外未加载成功时,该属性值占据图片位置进行显示的信息。
                 title:图片鼠标悬浮在图片上方的提升信息
                 <br/> :换行标签
(2)超链接标签:

····<a></a>中可以为图片也可以为汉字等。
             ···    属性:
                                 href:写跳转后的目标地址   加对应服务器的变量名点击后直接转入搜索值的结果页面。
                                 title:图片鼠标悬浮在链接上方的提升信息
(3)表单标签:
<form></form>:表单标签 包裹所有的表单元素。
属性 :
                      action:表单添加action属性        用于按钮        提交        表单内容的目的地址
                                                
                    method:
                                        表单数据提交的方式

target:表单数据响应的信息显示的位置(开新页面还是在本页面)
常用表单元素:
文本框:
<input></input>默认type是文本输入框
输入框,宽和高用style选择。
属性:name :用来保存用户输入的信息内容

maxlength:限制文本框输入的最大长度
placeholder:文本框在未输入值前的提示信息
readonly:只读 (在使用时因为只有一个选择且和其属性名相同,所以在使用时可以不赋值。)
value: 为文本框赋值 (用户输入的值就是value值,可以用其设置默认值:在文本框默认有)
disable: 禁用 也可以简写disable,不赋值。禁用和只读区别是禁用的值在提交表单时不会被提交。
type=“text”:设置input标签为文本框
输入框中的属性name ,在输入框中输入的内容都会赋值d。然后用提交按钮提交给表单。
密码框:
input的type=“password” ,属性和文本框一致
单选按钮:
input的type=“radio” 属性和文本框一致,但是name还有区分是否为同一组单选按钮的作用,且有value属性值才会提交按钮内容

                        注:type选择类型时不能有空格,否则赋值失败
                                disabled:让该单选按钮禁用
                                checked:默认,开始时有其属性的按钮默认选择
复选框:
除了 input 的type=“checkbox” 其余和单选按钮一致。
隐藏域:
input 的type=“hidden ”  不会显示在页面中,但里面内容会提交
按钮:

时间控件:

邮箱控件:

下拉列表:
                       
(4)表格标签:
<!DOCTYPE html>
<html>
        <head>
                <meta charset="UTF-8">
                <title></title>
        </head>
        <body>
                <!--表格:4行4列
                        table:表格
                        tr:行
                        td:单元格
                        th:特殊单元格:表头效果:加粗,居中
                        默认情况下表格是没有边框的,通过属性来增加表框:
                        border:设置边框大小
                        cellspacing:设置单元格和边框之间的空隙
                        align="center"  设置居中
                        background 设置背景图片 background="img/ss.jpg"
                        bgcolor :设置背景颜色
                        rowspan:行合并
                        colspan:列合并
                -->
                <table border="1px" cellspacing="0px" width="400px" height="300px" bgcolor="darkseagreen" >
                        <tr bgcolor="bisque">
                                <th>学号</th>
                                <th>姓名</th>
                                <th>年纪</th>
                                <th>成绩</th>
                        </tr>
                        <tr>
                                <td align="center">1001</td>
                                <td>丽丽</td>
                                <td>19</td>
                                <td rowspan="3">90.5</td>
                        </tr>
                        <tr>
                                <td colspan="2" align="center">2006</td>
                                <td>30</td>
                        </tr>
                        <tr>
                                <td>3007</td>
                                <td>小明</td>
                                <td>18</td>
                        </tr>
                </table>
        </body>
</html>



















