前端学习html篇

最新推荐文章于 2024-05-18 21:57:13 发布

TomCruisePro

最新推荐文章于 2024-05-18 21:57:13 发布

阅读量370

点赞数

文章标签：前端 html 学习

本文链接：https://blog.csdn.net/tomcruisepro/article/details/123565719

版权

1.块级会以新行出现h1、p、ul、table、div内联函数通常不会以新行出现b、td、img、a、span
2.计算机代码kbd>, samp>, 以及 code> 元素全都支持固定的字母尺寸和间距
code元素不保留多余的空行和折行，为解决该问题，必须借用pre来包围代码
3.var元素中定义数学变量
4.html5语义元素
span和div是非语义元素，from\table\img是语义元素
header元素被用作为介绍性内容的容器，一个文档中可以有多个header元素，可作页眉
fooster页脚
nav定义导航链接
aside侧栏
图片和标题可以组合在figure中
figcaption定义图片标题
*为什么要使用html5？因为在html4中，开发者会用他们喜爱的属性名来定义样式，浏览器有时候无法识别正确的属性内容，而使用html5元素，这些问题都会迎刃而解
html5标准中，head标签能够被省略
*注释<!-- balibala --!>
5.字符实体&#数字；表情也是这样定义的😀😄 😍 💗
6.frameset框架结构标签不能和body一起使用noresize属性可以定义frame标签不可以拉伸
7.iframe内联框架
8.表单的处理程序在action中定义
9.meta标签是用在html中模拟http响应头报文
10.input中要设置name属性才能被正确地提交
11.fieldset用来组合表单数据、legeng元素为fieldset设置标题
12.form中的属性有action name method
target（规定提交的表单在哪里响应），_blank、_self、_parenet、_top默认self表示在当前窗口打开
13.novalidate是一个bool属性，如果已设置，规定给提交的时候不验证表单数据
14.select元素定义下拉列表，跟option配用
15.textarea定义多行输入文本域
16.radio定义单选按钮
17.input属性formencrype规定发送表单的时候服务器如何对其编码input中的form属性规定input所属的表单。
formaction属性会覆盖action
18.object、embed元素定义html文档中规定嵌入式对象
19.html中播放声音可以用object、emb嵌入，当然最好还是使用
20.使用雅虎播放器需要加这么一段代码script type=“text/javascript” src=“http://mediaplayer.yahoo.com/js”>/script>到网页底部，然后把mp3文件链接到html中，javascript会自动为每首歌创建播放按钮
21.embed标签的作用是在html中嵌入多媒体中
22.html中article、section、div是差异很小。
section被定义为相关元素的块、article被定义为相关元素的完整的自包含块、div被定义为子元素的块
23.html5用于定位用户的位置：
使用getCurrentPosition方法来获得用户的位置
如果getCurrentPosition()运行成功，则向参数showPosition中规定的函数返回一个coordinates对象

<!DOCTYPE html>
<html>
<body>
<p id="demo">点击这个按钮，获得您的位置：</p>
<button onclick="getLocation()">试一下</button>
<div id="mapholder"></div>
<script>
var x=document.getElementById("demo");
function getLocation()
  {
  if (navigator.geolocation)
    {
    navigator.geolocation.getCurrentPosition(showPosition,showError);
    }
  else{x.innerHTML="Geolocation is not supported by this browser.";}
  }

function showPosition(position)
  {
  var latlon=position.coords.latitude+","+position.coords.longitude;

  var img_url="http://maps.googleapis.com/maps/api/staticmap?center="
  +latlon+"&zoom=14&size=400x300&sensor=false";
  document.getElementById("mapholder").innerHTML="<img src='"+img_url+"' />";
  }

function showError(error)
  {
  switch(error.code) 
    {
    case error.PERMISSION_DENIED:
      x.innerHTML="User denied the request for Geolocation."
      break;
    case error.POSITION_UNAVAILABLE:
      x.innerHTML="Location information is unavailable."
      break;
    case error.TIMEOUT:
      x.innerHTML="The request to get user location timed out."
      break;
    case error.UNKNOWN_ERROR:
      x.innerHTML="An unknown error occurred."
      break;
    }
  }
</script>
</body>
</html>

24.Geolocation对象的其它方法
watchPosition()，通常用showposition作为它的参数，返回用户当前的位置，并继续返回用户的更新位置
clearwatch()停止watchPostion()方法
25.html5拖放
dataTransfer.setData(“text",ev.target.id)方法设置被拖动数据类型和值
ondragover()拖到什么地方，一般w1们必须阻止这种拖动的默认处理方式由该事件的event.preventDefault()方法实现
ev.preventDefault();还可以组织浏览器的默认处理方式
dataTransfer.getData() 方法获得被拖的数据返回在 setData() 方法中设置为相同类型的任何数据
26.使用应用程序缓存，通过创建cache mainifest文件，轻松创建web应用的离线版本
mainifest文件告知浏览器被缓存的内容
27.web workers:就是写好web worker文件一般是js代码，然后再html中实现和接收
28.html server sent事件允许服务器从网页获得更新
server_sent事件是指网页自动从服务器获得更新
EventSource 对象用于接收服务器发送事件通知：

服务器配合更新的代码实例：

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

$time = date('r');
echo "data: The server time is: {$time}\n\n";
flush();
?>

TomCruisePro

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
前端学习html篇

1.块级会以新行出现h1、p、ul、table、div内联函数通常不会以新行出现b、td、img、a、span2.计算机代码kbd>, samp>, 以及 code> 元素全都支持固定的字母尺寸和间距code元素不保留多余的空行和折行，为解决该问题，必须借用pre来包围代码3.var元素中定义数学变量4.html5语义元素span和div是非语义元素，from\table\img是语义元素header元素被用作为介绍性内容的容器，一个文档中可以有多个header元素，可作页眉
复制链接

扫一扫