百分百源码网-让建站变得如此简单! 登录 注册 签到领金币!

主页 | 如何升级VIP | TAG标签

当前位置: 主页>网站教程>html5教程> HTML中必需把握的见识点是什么
分享文章到:

HTML中必需把握的见识点是什么

发布时间:12/01 来源:未知 浏览: 关键词:

你是怎样懂得 HTML 语义化的?

学习视频分享:html视频教程

让页面内容构造化,它有如下长处

1、易于会员阅读,样式丧失的时候能让页面显现清楚的构造。

2、有益于SEO,搜索引擎按照标签来肯定上下文和各个关键字的权重。

3、利便其他设备解析,如盲人阅读器按照语义渲染网页

4、有益于开发和保护,语义化更具可读性,代码更好保护,与CSS3关系更和谐

如:

43d0472a38ed9d78c97c8c393736f13.png

meta viewport 是做什么用的,如何写?

平常viewport是指视窗、视口。阅读器上(也大概是一个app中的webview)用来显示网页的那部分区域。在移动端和pc端视口是不一样的,pc端的视口是阅读器窗口区域,而在移动端有三个不一样的视口概念:规划视口、视觉视口、抱负视口

meta有两个属性name 和 http-equiv

1、name

keywords(关键字) 告诉搜索引擎,你网页的关键字
description(网站内容描写) 用于告诉搜索引擎,你网站的主要内容。
viewport(移动端的窗口) 后面介绍
robots(定义搜索引擎爬虫的索引方式) robots用来告诉爬虫哪些页面需要索引,哪些页面不需要索引
author(作者)
generator(网页制作软件)
copyright(版权)

2、http-equiv 望文生义,相当于http的文件头作用

content-Type 设定网页字符集
//旧的HTML,不引荐
//HTML5设定网页字符集的方式,引荐使用UTF-8
X-UA-Compatible(阅读器采纳哪种版原本渲染页面)
//指定IE和Chrome使用最新版本渲染当前页面
cache-control(恳求和响应遵照的缓存机制)
expires(网页到期时间)

canvas画布

const ctx = canvas.getContext(‘2d’); // 猎取它的2d上下文
ctx.fillStyle = ‘green’; // 设定笔刷的填充色
ctx.fillRect(10, 10, 100, 100); // 利用画笔范畴,矩形,比方圆

video

autoplay 布尔属性;视频立刻主动开端播放,不会停下来等着数据载入完毕。
controls 供给会员操纵,同意会员操纵视频的播放,包罗音量,跨帧,暂停/复原播放。
loop 布尔属性;指定后,会在视频结尾的地方,主动返回视频开端的地方。
track标签表示的是字幕
poster 表示的是封面

h5移动端页面

WebView是一种控件,它基于webkit引擎,因此具备渲染Web页面的功效。
基于Webview的混合开发,就是在 Anddroid (安卓)/(iphone)原生APP里,通过WebView控件嵌入Web页面。
许多APP都是外边套原生APP的壳,内容是H5页面(基于html+css+js的Web页面)。此刻的移动端混合开发软件,假如关于交互渲染要求不是特殊高的项目,根本都是这么玩的。

HTML5新特性

当地储备特性
设备兼容特性 HTML5供给了空前绝后的数据与利用接入开放接口
连接特性 WebSockets
网页多媒体特性 支撑Audio Video SVG Canvas WebGL CSS3
CSS3特性

区分一般显示屏和高清屏

当devicePixelRatio值等于1时(也就是最小值),那么它一般显示屏。
当devicePixelRatio值大于1(平常是1.5、2.0),那么它就是高清显示屏。
不一样像素的牟利用媒体查询结合 devicePixelRatio 可以区分一般显示屏和高清显示屏

CSS设计方案:

.css{/* 一般显示屏(设备像素比例小于等于1.3)使用1倍的图 */ 
    background-image: url(img_1x.png);
}
@media only screen and (-webkit-min-device-pixel-ratio:1.5){
	.css{/* 高清显示屏(设备像素比例大于等于1.5)使用2倍图  */
	    background-image: url(img_2x.png);
	  }
}

效劳端用nginx对图片停止处置

想要什么样尺寸的图片本人裁切,我们供给了按比例缩放和自定尺寸的裁切办法,地址后拼接字符串就行。

cookie、localStorage和SessionStorage的不同和特点

1、LocalStorage特点:

只保存在客户端
当地永远储备,关闭阅读器不会清除,除非会员从阅读器清除
每个域可以最多储备5MB

2、SessionStorage特点:

只保存在客户端
当地暂时储备,在页面会话完毕时会被清除
储备大小与localStorage雷同

3、Cookie特点:

效劳端和客户端都可以拜访
可以设定有效期,过期后将会主动删除。假如不设定则是关闭阅读器后失效
储备大小只要4kb
有储备个数限制。每个阅读器限制不一样。倡议20个之内。最多的阅读器可以支撑50个

相关引荐:html教程

以上就是HTML中必需把握的知识点是什么的具体内容,更多请关注百分百源码网其它相关文章!

打赏

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

百分百源码网 建议打赏1~10元,土豪随意,感谢您的阅读!

共有150人阅读,期待你的评论!发表评论
昵称: 网址: 验证码: 点击我更换图片
最新评论

本文标签

广告赞助

能出一分力是一分吧!

订阅获得更多模板

本文标签

广告赞助

订阅获得更多模板