您的位置:首页 > Web前端 > HTML

html 学习知识

2015-07-06 17:01 585 查看
<input type="color" name="color">
<input type="date" name="color">
E-mail: <input type="email" name="email">
数量 ( 1 到 5 之间): <input type="number" name="quantity" min="1" max="5">
<input type="range" name="points" min="1" max="10">
Search Google: <input type="search" name="googlesearch">
选择时间: <input type="time" name="usr_time">
电话号码: <input type="tel" name="usrtel">
添加您的主页: <input type="url" name="homepage">
选择周: <input type="week" name="week_year"  width:"100"; height:"100";>
<input type="submit" value="涂胶">
<article>文章主要内容</article>
<aside>辅助文章内容</aside>
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
您的浏览器不支持 audio 元素。
</audio>
<base href="http://www.w3cschool.cc/images/" target="_blank">

<input list="browsers">

<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>

<em>泄题</em>
<embed src="helloworld.swf" tppabs="http://w3schools.com/tags/helloworld.swf">
<fieldset>

<legend>用户表单列表</legend>
<input type="text"/>
</fieldset>

<footer>
<p>Posted by: Hege Refsnes</p>
<p><time pubdate datetime="2012-03-01"></time></p>
</footer>

<frameset cols="25%,*,25%">
<frame src="frame_a.htm">
<frame src="frame_b.htm">
<frame src="frame_c.htm">
</frameset>

<frameset rows="50%,50%">
<frame src="frame_a.htm">
<frameset cols="25%,75%">
<frame src="frame_b.htm">
<frame src="frame_c.htm">
</frameset>
</frameset>

<em> (被强调的文本)
<strong> (重要的文本)
<mark> (被标记的/高亮显示的文本)
<cite> (作品的标题)
<dfn> (一个定义项目)
有主流浏览器都支持 <i> 标签。

用户名: <input type="text" name="usr_name">
加密: <keygen name="security">
<keygen keytype="rsa|dsa|ec"> 用户安全算法三种

label  map标签

<menu type="toolbar">
<menu label="File">
<a href="#">aaa1</a>
<a href="#">aaa2</a>
</menu>

<meter value="2" min="0" max="10">2 out of 10</meter><br>
<meter value="0.6">60%</meter>  progress滚动条

<nav>
<a href="/html/">HTML</a> |
<a href="/css/">CSS</a> |
<a href="/js/">JavaScript</a> |
<a href="/jquery/">jQuery</a>
</nav>

<frameset cols="25%,50%,25%">
<frame src="frame_a.htm">
<frame src="frame_b.htm">
<frame src="frame_c.htm">
<noframes>Sorry, your browser does not handle frames!</noframes>不支出输出这个
</frameset>

<script>
document.write("Hello World!")
</script>
<noscript>Your browser does not support JavaScript!</noscript>

<object width="400" height="400" data="helloworld.swf" >
</object>  也支出出入swf动画文件(支持所有流媒体文件) <embed >也支持

<select>
<optgroup label="Swedish Cars">  标题
<option value="volvo">Volvo</option> 选项
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>

<object data="horse.wav">
<param name="autoplay" value="true"> 自动播放
</object>

<progress value="22" max="100">
</progress>

small标签

<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
您的浏览器不支持 audio 元素。
</audio>

<time datetime="2008-02-14">Valentines day</time>

GET 方法
请注意,查询字符串(名称/值对)是在 GET 请求的 URL 中发送的:

/test/demo_form.php?name1=value1&name2=value2
有关 GET 请求的其他一些注释:

GET 请求可被缓存
GET 请求保留在浏览器历史记录中
GET 请求可被收藏为书签
GET 请求不应在处理敏感数据时使用
GET 请求有长度限制
GET 请求只应当用于取回数据
POST 方法
请注意,查询字符串(名称/值对)是在 POST 请求的 HTTP 消息主体中发送的:

POST /test/demo_form.php HTTP/1.1
Host: w3cschool.cc
name1=value1&name2=value2
有关 POST 请求的其他一些注释:

POST 请求不会被缓存
POST 请求不会保留在浏览器历史记录中
POST 不能被收藏为书签
POST 请求对数据长度没有要求

localStorage.clickcount=Number 使用

localStorage.clickcount=Number(localStorage.clickcount)+1;
alert(localStorage.clickcount);

sessionStorage   浏览器关闭 数据会被清空  但是localStorage不会被清空

什么是应用程序缓存(Application Cache)?
HTML5 引入了应用程序缓存,这意味着 web 应用可进行缓存,并可在没有因特网连接时进行访问。

应用程序缓存为应用带来三个优势:

离线浏览 - 用户可在应用离线时使用它们
速度 - 已缓存资源加载得更快
减少服务器负载 - 浏览器将只从服务器下载更新过或更改过的资源。
<html manifest="demo_html.appcache">  离线也可以访问

Server- Send
<script>
if(typeof(EventSource)!=="undefined")
{
var source=new EventSource("demo_sse.php");
source.onmessage=function(event)
{
document.getElementById("result").innerHTML+=event.data + "<br>";
};
}
else
{
document.getElementById("result").innerHTML="抱歉,你的浏览器不支持 server-sent 事件...";
}
</script>

<?php
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');

$time = date('r');
echo "data: The server time is: {$time}nn";
flush();
?>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: