META:
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> “IE=edge” 强制IE 以最高级模式渲染文档,也就是任何 IE 版本都以当前版本所支持的最高级标准模式渲染,避免版本升级造成的影响。“chrome=1” 强制 IE 使用 Chrome Frame 渲染
<meta name="renderer" content="webkit"> 强制360用极速模式 2016-1-7 360的文档:http://se.360.cn/v6/help/meta.html
<meta http-equiv="mobile-agent" content="format=html5;url=http://m.cat.com/sitemap/sitemapindex.html" /> PC网页的移动适配
<link rel="canonical" href="http://www.cat.com/sitemap/sitemapindex.html"> 手机网页上的,告知搜索引擎是重复内容
页面:
<!doctype html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="pragma" content="no-cache" /> <title></title> <!-- jquery库 --> <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script> <!-- bootstrap库 --> <link href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"> <script src="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> <script type="text/javascript"> $(function(){ $("#div1").click(function(){ }); }); </script> <style type="text/css"> </style> </head> <body> </body> </html>
前端实现QQ会话功能 2016-5-18
<a href="tencent://message/?uin=客服QQ号码&Menu=yes" target="blank"></a>
iframe
<style type="text/css"> html,body{width:100%;height:100%;} </style> <iframe src='' frameborder='no' width='100%' height='100%' scrolling='auto' id=""></iframe>
表格
<style type="text/css"> body{font-family:"微软雅黑";} .table1{border:1px solid #4472c4;border-collapse:collapse;width:100%;} .table1 tr{border:1px solid #4472c4;} .table1 th{padding:5px;font-size:16px;background:#4472c4;color:#FFF;} .table1 td{padding:5px 10px;font-size:14px;text-align:center;} </style> <table class="table1"> <tr><th>ID</th><th>名称</th><th>类型</th><th>时间</th><th>操作</th></tr> <tr><td>10005</td><td>啊啊啊啊</td><td>type</td><td>2014-9-18</td><td>启用</td></tr> <tr><td>10005</td><td>啊啊啊啊</td><td>type</td><td>2014-9-18</td><td>启用</td></tr> </table>
一个普通的灰色线表格: 2016-5-20
<style type="text/css"> .table1{border-collapse:collapse;width:1190px;} .table1 td{border:1px solid #ececec;font-size:14px;padding:15px;} .table1 .t0{width:120px;text-align:center;} .table1 .t1{width:413px;} </style> <table class="table1"> <tr> <td class="t0">表格头</td> <td class="t1">灰色线表格</td> <td class="t0">表格头</td> <td class="t1">灰色线表格</td> </tr> </table>
不同屏幕使用不同样式表文件
<link rel="stylesheet" type="text/css" href="a.css" media="screen and (min- 400px)"> <link rel="stylesheet" type="text/css" href="b.css" media="screen and (min- 600px) and (max- 800px)">
一些被遗忘的标签:
1、<optgroup>相关标签项组合在一起
<style type="text/css"> optgroup{color:red;} option{color:#000;} </style> <select name=""> <optgroup label="华北"> <option value="">北京</option> <option value="">天津</option> </optgroup> <optgroup label="华南"> <option value="">深圳</option> <option value="">广州</option> </optgroup> </select>
2、列表
<input id="mycar" list="cars" /> <datalist id="cars"> <option value="bmw"> <option value="ford"> <option value="volvo"> </datalist>
3、<xmp>将代码显示在页面上
<xmp> <script type="text/javascript"> alert("显示代码"); </script> </xmp>
禁止选取 复制 <body onselectstart="return false">
10秒后跳转 <meta http-equiv="Refresh" content="10;URL=http://www.baidu.com" />
ico图标 <link rel="Shortcut Icon" href="favicon.ico" >
背景音乐 <bgsound src="音乐url" loop="-1">
首页 <a href="#" onclick=this.style.behavior='url(#default#homepage)';this.setHomePage('http://链接'); >设为首页</a>
收藏夹 <a href="Javascript :window.external.addFavorite('http://链接','说明');" > 加入收藏夹</a>
在ie8上支持html5视频
<script src="http://html5media.googlecode.com/svn/trunk/src/html5media.min.js"></script>
http://bbs.csdn.net/topics/390642234 初学的看这个
http://www.cnblogs.com/qq21270/p/4015265.html 仿制soundmanager2右上角面板 2014-10-10
http://www.cnblogs.com/qq21270/p/4048689.html 作着玩,一个纯css登录页。支持chrome FireFox 和 IE10+,(IE9也能显示,IE9以下不支持)2014-10-24