html 文件就是充当模板使用，包含head头和body身体，body包含众多的标签，每个标签都使用尖括号包裹，内部由标签名和标签属性构成。
其中标签分为2类：
    1：块级标签，特点：占用一行，如：<h>,<p>,<div> 等
    2：行内标签，特点：只占用自身大小，如：<span>,<input>,<a> 等
    标签存在的意义：用于定位操作，css操作，js操作
    html特殊符号参考：http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html
    适用于大多数 HTML 元素的属性
    属性 值              描述
    class  classname      规定元素的类名（classname）
    id     id             规定元素的唯一 id
    style  style_definition   规定元素的行内样式（inline style）
    title  text           规定元素的额外信息（可在工具提示中显示）

<!DOCTYPE html> <!--对应关系，代表一个统一的默认规范-->
<html lang="en">
<head> <!-- html 头-->
    <!-- meta：提供有关页面的元信息 -->
    <meta http-equiv='content-type',content='text/html',charset='utf-8'> <!--页面编码-->
    <meta http-equiv="Refresh" Content="30"> <!-- 默认30秒刷新一次-->
    <meta http-equiv="Refresh" Content="5;Url=http;//www.authhome.com.cn"/> <!-- 5秒自动跳转-->
    <meta name="keywords" content="星级2，关键词。。"> <!--用于搜索引擎进行关键字搜索-->
    <meta name="description" content="描述的内容"/> <!--网站描述说明-->
    <meta http-equiv="X-UA-Compatible" content="IE=IE9;IE8;IE7"/> <!--进行ie的兼容 从大到小模式兼容打开-->
    <title>首页</title>  <!-- 标题 -->
    <link rel="shortcut icon" href="image/favicon.ico">  <!--页面标题上的图片和位置，字串是固定的-->
    <!-- <style></style> css样式的时候在css文档记录说明-->
</head>
<body> <!-- html 体-->
<!-- 重要标签20个如下说明-->
<!--  HTML 标题，通过 <h1> - <h6> 等标签进行定义的，<h1> 定义最大的标题。<h6> 定义最小的标题 -->
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
<h6>This is a heading</h6>

<!-- HTML 段落 通过 <p> 标签进行定义的-->
<p>This is a paragraph.</p>
<p>This is another<br /> paragraph.</p>

<!-- HTML 链接 通过 <a> 标签进行定义的-->
<!-- 功能1：跳转-->
<a href="http://www.w3school.com.cn">This is a link</a>
<!-- 功能2：锚  一般用于通过目录跳转到当前页面的指定位置-->
<a href="#某个标签的ID">测试</a>

<!--  HTML 图像 通过 <img> 标签进行定义的-->
<!-- 属性 src：图片的位置-->
<!-- 属性 title：鼠标指向图片的提示信息-->
<!-- 属性 alt： 属性用来为图像定义一串预备的可替换的文本-->
<img src="w3school.jpg" width="104" height="142" title="鼠标提示" alt="图片信息"/>

<!--  div 可用于组合其他 HTML 元素的容器,没有特定的含义-->

<!--  span 用作文本的容器,没有特定的含义 -->

<!-- input系列  -->
<input type="text" name="名称" value="默认值" />
<input type="password" name="名称" value="默认值" />
<input type="submit" value="表单提交按钮" />
<input type="button" value="登录按钮" />
<!-- 单选框，多个单选框name值相同才可单选-->
<input type="radio" name="名称" checked="checked" value="提交的值">
<!-- 多选框，批量获取数据-->
<input type="checkbox" name="名称" value="提交的值">
<!--上传文件，依赖form表单的一个属性：enctype="multipart/form-data"（表示把文件一点一点发给服务器）-->
<input type="file">
<input type="reset" value="重置" />
<textarea name="留言框">默认值</textarea>
<!-- select 下拉选项 -->
<select name="名称" size="显示数量" multiple="multiple多选">
    <option value="值1">选项1</option>
    <option value="值2">选项2</option>
</select>

<!-- table 标签 colspan:列合并单元格，rowspan：行合并单元格-->
<table border="1">
    <thead>
        <tr>
            <th></th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td></td>
            <td></td>
        </tr>
    </tbody>
</table>

<!-- label 用于点击文字，使得关联的标签获取光标-->
<label>文字</label>

<!-- form 表单 -->
<form action="http://www.baidu.com" method="GET/POST">
    <input type="text" name="user" />
    <input type="password" name="password" />
    <!-- 提交到后台字典格式：{'user':'用户名','password':'密码'} -->
    <!--以GET提交数据会将所有数据拼接在URL如：http://...index.html?user=名称&password=密码
        以POST提交数据URL保持不变，数据会包含在内容里一起提交-->
    <input type="button" value="login1"/>  # 默认button没反应
    <input type="submit" value="login2"/>
</form>

<!-- 表单举例-->
<form enctype="multipart/form-data">
    <p>请选择</p>
    <!-- 选择按钮，名称必须一致才能进行选择,必须通过value值进行判断所选择的是哪个选择 -->
    男：<input type="radio" name="garden" value="1" checked="checked"/>
    女：<input type="radio" name="garden" value="2"/>
    <br />
    <p>爱好</p>
    篮球：<input type="checkbox" name="favor" value="1" checked="checked">
    足球：<input type="checkbox" name="favor" value="2">
    皮球：<input type="checkbox" name="favor" value="3">
     <p>技能</p>
    唱歌：<input type="checkbox" name="skill" value="1">
    跳舞：<input type="checkbox" name="skill" value="2">
    <p>上传文件</p>
    <input type="file" name="fname">
    <textarea name="meno">默认值 </textarea>

    <select name="city" size="10" multiple="multiple">
        <option value="1">北京</option>
        <option value="2">上海</option>
        <option value="3" selected="selected">成都</option>
    </select>
    <select>
        <!-- 分组-->
        <optgroup label="河北">
            <option>石家庄</option>
            <option>保定</option>
        </optgroup>
    </select>
    <input type="submit" value="提交" />
    <input type="reset" value="重置" />
</form>

最新文章

  1. java中文乱码解决之道（四）-----java编码转换过程
  2. Hive On Spark概述
  3. Linux下Java安装与配置
  4. python 小试牛刀之信息管理
  5. Mac 如果一定要写个锁屏程序的话就这样
  6. lintcode ：二叉树的最大深度
  7. 《算法问题实战策略》-chaper32-网络流
  8. 静态方法中不能new内部类的实体对象
  9. [UI]抽屉菜单DrawerLayout分析（三）
  10. hdu 3790 （最短路径问题dijkstra）
  11. Ising模型（伊辛模型）
  12. 虚拟机 centos 7 nginx安装
  13. 初始化css样式的原因
  14. bzoj 3669: [Noi2014] 魔法森林 LCT版
  15. 深入C#.NET数据类型
  16. SSH会话连接超时问题
  17. 【转】Nginx配置详解
  18. distinct的用法
  19. C++ WMI获取系统硬件信息(CPU/DISK/NetWork etc)
  20. Heroku登录问题

热门文章

  1. 项目适配iOS9遇到的一些问题及解决办法 ,以及URL 白名单配置方法
  2. 盘点那些年，被Oracle收购的公司
  3. 正确使用MySQL JDBC setFetchSize()方法解决JDBC处理大结果
  4. 如何用Chrome自带的截屏功能截取超过一个屏幕的网页
  5. leetcode_41. First Missing Positive_cyclic swapping
  6. vs code 插件list
  7. 在移动端实现1px的边框
  8. 利用条件运算符的嵌套来完成此题： 学习成绩&gt;= 90分的同学用A表示， 60-89分之间的用B表示， 60分以下的用C表示。
  9. 安卓adb在拨号键盘上输入井号(#)
  10. IDEA无法编译源码，IDEA查看源码出现/* compiled code */