html
Euphoria_zx
欢欣之意,皆由你。
展开
-
html的页面解析
html解析 第一步会识别html代码 绘制dom树(深度优先原则) 1, 首先识别html 2, 然后识别 head 3, 识别head里面含有的标签 4, 识别完以后才会识别body (注意:dom树 解析和加载是异步的 比如<img src='xxxx'> 会直接解析下面 不会等src加载进来 ) 绘制dom树完后等css树 最后形...原创 2019-03-09 15:21:17 · 3451 阅读 · 0 评论 -
应用程序缓存
应用程序缓存 概念:使用HTML5,通过创建 cache manifest 文件,可以轻松地创建web应用的离线版本 优势 可配置需要缓存的资源 网络无连接应用仍可用 本地读取缓存资源,提升访问速度,增强用户体验 减少请求,缓解服务器负担 Cache Manifest 基础 如需启用应用程序缓存,需要在文档的<html>标签中包含manifest属性,值为应用程序缓存清单文件...原创 2019-05-06 18:53:19 · 710 阅读 · 0 评论 -
地理定位接口
地理定位接口 获取位置的方式(常规可用方式,而浏览器自动选择,我们无法控制) ip地址 优点是在任何地方都可用,在服务器端处理 缺点是不精确(一般只能精确到城市级);运算代价大 GPS 优点是精确度高 缺点是定位事件长,耗电量大;室内效果差;需要额外硬件设备支持 WI-FI 优点是精确;可在室内使用;简单、快捷 缺点是在WI-FI接入点少的地区无法使用 手机信号 优点是相当...原创 2019-05-06 18:51:37 · 2038 阅读 · 0 评论 -
html多媒体标签
多媒体标签 audio:音频 *src:文件路径 *controls:控制面板 autoplay:自动播放 loop:循环播放 video:视频 *src:文件路径 *controls:控制面板 autoplay:自动播放 loop:循环播放 width:宽度 height:高度 poster:封面占位图 source:不同浏览器支持的视频格式不同,所以...原创 2019-05-06 18:26:46 · 634 阅读 · 0 评论 -
弹性布局
弹性布局 设置父元素 display: flex; 这会使每个子元素自动变为伸缩项 所谓伸缩项,就是说当父元素的宽度不足以容纳所有子元素时,会将子元素进行等比例收缩直到父容器足以一行放下所有子元素 设置父元素的 justify-content 值 flex-start 让子元素从父元素的起始位置开始依次排列 flex-end 让子元素依次排列直至正好排到父元素的末尾 center 依次...原创 2019-05-06 18:10:33 · 374 阅读 · 0 评论 -
web字体和图标
web字体和图标 介绍 开发人员可以为自己的网页指定特殊的字体,无需考虑用户电脑上是否安装了此特殊字体,从此把特殊字体处理成图片的时代已经过去。而且它的支持程度很好,甚至低版本ie也能支持 字体格式:不同浏览器所支持的字体格式不一样 .ttf格式:是windows和mac最常见的字体,是一种RAW格式,支持这种字体的浏览器有ie9+,fixfox3.5+,chrome4+,safari3...原创 2019-05-06 18:08:24 · 1450 阅读 · 0 评论 -
3D转换
3D转换 3D移动 方法:translate3d(x, y, z)使元素在这坐标轴上移动,可以分开写,如:translateX(),translateY(),translateZ() 3D缩放 方法:scale3d(x, y, z)使元素在三个坐标轴上缩放,可以分开写,如:scaleX(), scaleY(), scaleZ() 3D旋转 方法:rotate3d(x, y, z, ...原创 2019-05-06 17:52:48 · 720 阅读 · 0 评论 -
2D转换
2D转换 transform 2D移动:translate()。使用translate()函数,可以把元素从原来的位置移动,移动参照元素左上角原点 语法:translate(x px) | translate(x, y px) 只设置一个参数表示向x方向移动,设置两个参数表示向x和y方向移动 也可以使用translateX(x)或者translateY(y) 执行完毕之后会回到原始状态 有一个...原创 2019-05-06 17:50:58 · 587 阅读 · 0 评论 -
css背景颜色之颜色渐变
颜色渐变(这是background的一个属性) background: linear-gradient(方向,开始颜色 位置,颜色2 位置,颜色3 位置……) 沿着某条直线朝一个方向产生渐变效果 参数设置 方向参数 设置的是线性渐变的方向 取值可以取to top / to right / to bottom / to left 也可以取0deg / 90deg / 180deg / 270...原创 2019-05-06 17:26:56 · 5845 阅读 · 0 评论 -
css选择器
选择器 id选择器 名称只能由字母、数字、下划线构成,且不能以数字开头 class选择器 标签选择器 通配符选择器 后代选择器 空格 浏览器底层遍历父子选择器是从右往左看的 直接子元素选择器 > 并列选择器 div.box 选择class为box的div,即交集,可以继续添加选择条件 分组选择器 , 表示被逗号分隔的选择器公用一个代码块,即并集 伪类选择器 ...原创 2019-05-06 17:21:03 · 103 阅读 · 0 评论 -
html 元素内容溢出省略号显示
元素溢出打点显示 在页面中我们有时会遇到文本太长又不想让它换行显示 我们就可以用这种方法让页面更加好看 css样式: div { width: 200px; height: 200px; border: 1px solid black; /* 元素溢出内容 隐藏 */ ...原创 2019-03-23 14:33:50 · 2468 阅读 · 0 评论 -
多媒体接口
多媒体接口 词典网址 http://www.w3school.com.cn/tags/html_ref_audio_video_dom.asp 常用方法 load():加载 play():播放 pause():暂停 jQuery没有提供对视频播放控件的方法,也就意味着,如果要操作视频播放,必须使用原生的js方法 常用属性 currentTime 视频播放的当前进度 duration...原创 2019-05-06 18:55:25 · 455 阅读 · 0 评论