HTML 模版

html>

<head>

<meta charset="utf-8"/>

<title>html template</title>

<meta name="keywords" content=""/>

<meta name="description" content=""/>

<meta name="viewport" content="width=device-width"/>

<link rel="stylesheet" href="css/style.css"/>

</head>

<body>

<!-- 文档容器 -->

<div class="g-wrapper">

    <!-- 头部 -->

    <header>

    </header>

    <!-- /头部 -->

    <!-- 主体容器 -->

    <div class="g-body">

        <!-- 侧栏 -->

        <aside>

        </aside>

        <!-- /侧栏 -->

        <!-- 主栏 -->

        <div class="g-main">

        <div>

        <!-- /主栏 -->

    <div>

    <!-- /主体容器 -->

    <!-- 页脚 -->

    <footer>

    </footer>

    <!-- /页脚 -->

</div>

<!-- /文档容器 -->

</body>

</html>

HTML 基本文档

<html>

<head>

<title>Document name goes here</title>

</head>

<body>

Visible text goes here

</body>

</html>

HTML 文本元素

<h1>一级标题</h1>

<p>段落</p>

<br /> （换行）

<hr /> （行线）

<blockquote>长引用</blockquote>

<q>短引用</q>

<pre>预格式文本</pre>

HTML 链接，图片

<a href="url">Link text</a>

<a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a>

<a name="tips">基本的注意事项 - 有用的提示</a>

<a id="tips">基本的注意事项 - 有用的提示</a>

<a href="#tips">跳到同一文本有用的提示的位置</a>

<img src="boat.gif" alt="Big Boat 当图片无法加载时的显示文本">

还可以和<map>和<area>一起制作图像地图

HTML 列表

无序列表

<ul>

  <li>咖啡</li>

  <li>茶</li>

  <li>牛奶</li>

</ul>

有序列表

<ol start="50">

  <li>咖啡</li>

  <li>牛奶</li>

  <li>茶</li>

</ol>

自定义列表

<dl> 标签定义了定义列表（definition list）。

<dl> 标签用于结合 <dt>（定义列表中的项目）和<dd>（描述列表中的项目。）

<dl>

   <dt>咖啡</dt>

   <dd>咖啡是利用咖啡豆制作的饮料</dd>

   <dt>牛奶</dt>

   <dd>牛奶是。。。</dd>

   <dt>茶</dt>

   <dd>茶是。。。</dd>

</dl>

HTML 表格

<table border="1">

<tr>  <!-- 表格的行 -->

  <th>姓名</th> <!-- 表格的表头 -->

  <th>电话</th>

  <th>电话</th>

</tr>

<tr>

  <td>Bill Gates</td> <!-- 表格的单元格data -->

  <td>555 77 854</td>

  <td>555 77 855</td>

</tr>

</table>表格边框

水平表头，垂直表头跨行rowspan，跨列colspan，单元格间距cellspacing，

边距cellpadding，边框宽度border，背景颜色，图像，内容位置，

利用border-collapse样式指定是否合并表格边框

HTML 表单

<form action=" " method="post/get">

<!-- 输入类型 -->

<input type="text" name="firstname" value="Mickey" size="20" maxlength="20">

<input type="password">

<input type="checkbox" checked="checked">

<input type="radio"  name="sex" value="male" checked="checked">

<input type="submit" value="Submit">

<input type="reset">

<input type="button" onclick="alert('Hello World!')" value="Click Me!">

 <input type="number" name="quantity" min="1" max="5">

<input type="date" name="birthday">

<input type="color" name="favcolor">

<input type="range" name="points" min="0" max="10">

<input type="time" name="usr_time">

 <input type="datetime-local" name="bdaytime">

<input type="email" name="email">

<input type="search" name="googlesearch">

<input type="url" name="homepage">

设置预定义值的 <input> 元素

<input list="browsers" name="browser">

<datalist id="browsers">

  <option value="Internet Explorer">

  <option value="Firefox">

  <option value="Chrome">

  <option value="Opera">

  <option value="Safari">

</datalist>

<!-- 下拉列表 -->

<select name="cars">

<option value="volvo">Volvo</option>

<option value="saab">Saab</option>

<option value="fiat" selected>Fiat</option>

<option value="audi">Audi</option>

</select>

<textarea name="Comment" rows="20" cols="20"></textarea>

</form>

HTML 转义字符

建议用实体

"	双引号	"

&	&符	  &

<	左尖括号（小于号）	<

>	右尖括号（大于号）	>

 	空格	 

不建议用实体

¥	元	    ¥  ¥

¦	断竖线	¦	¦

©	版权	  ©	©

®	注册商标R  ®	®

™	商标TM	™	™

·	间隔符	·	·

«	左双尖括号	«	«

»	右双尖括号	»	»

°	度	     °	°

×	乘	    ×	×

÷	除	    ÷	÷

‰	千分比	 ‰	‰

HTML快速参考的更多相关文章

  1. Oracle安装部署，版本升级，应用补丁快速参考

    一.Oracle安装部署 1.1 单机环境 1.2 Oracle RAC环境 1.3 Oracle DataGuard环境 1.4 主机双机 1.5 客户端部署 二.Oracle版本升级 2.1 单机 ...

  2. Oracle 11.2.0.4单实例打PSU,OJVM PSU补丁快速参考

    写在前面: 1.Oracel打每个补丁的操作有时存在差异,所以不管多熟悉,都应该在打任何补丁之前阅读新补丁中附带的readme. 2.Oracle每季度都会更新一个最新的PSU,本文最新指的是当前最新 ...

  3. Oracle 11.2.0.4 DataGuard 环境打PSU,OJVM PSU补丁快速参考

    环境:RHEL6.5 + Oracle 11.2.0.4 DataGuard physical standby 主库和备库都是单节点. 需求:主备库同时应用160719的PSU和OJVM PSU补丁. ...

  4. 数据库 PSU，SPU(CPU)，Bundle Patches 和 Patchsets 补丁号码快速参考 (文档 ID 1922396.1)

    数据库 PSU,SPU(CPU),Bundle Patches 和 Patchsets 补丁号码快速参考 (文档 ID 1922396.1)

  5. jenkins2 pipeline 语法快速参考

    jenkins2 pipeline中常用的语法快速参考. 文章来自:http://www.ciandcd.com文中的代码来自可以从github下载: https://github.com/ciand ...

  6. oracle数据库 PSU，SPU(CPU)，Bundle Patches 和 Patchsets 补丁号码快速参考 (文档 ID 1922396.1)

    数据库 PSU,SPU(CPU),Bundle Patches 和 Patchsets 补丁号码快速参考 (文档 ID 1922396.1) 文档内容   用途   详细信息   Patchsets ...

  7. Razor 语法快速参考

    Razor 语法快速参考   本文引自:http://haacked.com/archive/2011/01/06/razor-syntax-quick-reference.aspx 语法名称 Raz ...

  8. 转: seajs手册与文档之 -- 快速参考 ( ~~useful )

    目录 快速参考 seajs.use seajs.config define require require.async exports module.exports 快速参考 该页面列举了 SeaJS ...

  9. Selenium 2.0 WebDriver 自动化测试 使用教程 实例教程 API快速参考

    Selenium 2.0 WebDriver 自动化测试 使用教程 实例教程 API快速参考 //System.setProperty("webdriver.firefox.bin" ...

  10. 【翻译】C#和.NET核心快速参考

    原文:[翻译]C#和.NET核心快速参考 PS:在网上看到的一篇C#总结,英文的,总结的还可以,都是基础知识,翻译给大家学习.文章结尾有英文原版.发布地址:http://www.cnblogs.com ...

随机推荐

  1. IE11的CSS兼容性问题

    最近测试给了我一大堆BUG,一瞅发现全是IE11的.吐槽一下这个浏览器真的比较特立独行.很多默认的样式跟别的浏览器不同,而且最明显的一点应该是padding左右内边距往往比别的浏览器大了一倍.但是当需 ...

  2. 在Laravel5.* 中使用 AdminLTE

    在Laravel5.* 中使用 AdminLTE AdminLTE是一个很棒的单纯的由 HTML 和 CSS 构建的后台模板,在这片文章中,我将讲述如何将 AdminLTE 和 Laravel 优雅的 ...

  3. C++顺序容器类总结

    主要是vector,deque,list,forward_list,array,string 插入方法: 元素访问: 元素删除: 容器赋值: forward_list有很多特殊的方法 毕竟平时forw ...

  4. JSP页面的五种跳转方法

    ①RequestDispatcher.forward() 是在服务器端起作用,当使用forward()时,Servlet engine传递HTTP请求从当前的Servlet or JSP到另外一个Se ...

  5. 一些嵌入式和FPGA相关模块的开源

    工作一年,整理下手头做过的东西,分享出来,希望能帮到大家. 嵌入式方面,主要集中在Xilinx家的器件上,ZYNQ居多.Linux相关的就不贴了,网上的资料太多,xilinx-wiki上资料都是比较全 ...

  6. asp.net中Timer定时器在web中无刷新的使用

    最近在做一个项目的时候,web端的数据需要与数据源进行实时同步,并保证数据的准确性,当时,考虑到使用ajax异步刷新技术.但后来在网上查找相关资料时,发现这样做,太浪费资源了,因为ajax的提交请求不 ...

  7. 成都OpenPart——DevOps专场活动参与感

    今天下午去参加了成都OpenPart——DevOps专场,感觉很好. 题外话: 回想一下,工作将近四年了,这是第一次参加类似的活动.自从结婚带了小孩以后,就基本上每个周末奔波工作和家里两个城市之间,这 ...

  8. 如何创建一个自定义jQuery插件

    简介 jQuery 库是专为加快 JavaScript 开发速度而设计的.通过简化编写 JavaScript 的方式,减少代码量.使用 jQuery 库时,您可能会发现您经常为一些常用函数重写相同的代 ...

  9. django中form表单的提交：

    一,关于表单: 表单在百度百科的解释:   表单在网页中主要负责数据采集功能.一个表单有三个基本组成部分: 表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法. 表单域 ...

  10. BZOJ 1634: [Usaco2007 Jan]Protecting the Flowers 护花

    Description Farmer John went to cut some wood and left N (2 <= N <= 100,000) cows eating the g ...