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 ™ ™ · 间隔符 · · « 左双尖括号 « « » 右双尖括号 » » ° 度 ° ° × 乘 × × ÷ 除 ÷ ÷ ‰ 千分比 ‰ ‰转载于:https://www.cnblogs.com/YeChing/p/6243771.html
