HTML+CSS
关注
分享
扫一扫
文章平均质量分 79
zh__quan
这个作者很懒，什么都没留下…
展开
-
(二)HTML
1. 表格 <table> <tr> <td></td> </tr> </table> 创建行<tr></tr> 在行中创建单元格<td></td&原创 2018-08-09 13:56:35 · 169 阅读 · 0 评论 -
HTML新特性之二 ---视频和音频
视频特性<video src="birds.mp4 "></video>成员属性autoplay:false 是否自动播放controls:false 是否显示播放控件loop:false 是否循环播放muted:false 是否静音poster:"" 是在播放第一帧之间显示海报=>图片preload: 视频的预加载策略auto: ...原创 2019-07-27 11:28:22 · 254 阅读 · 0 评论 -
HTML5 新特性之三---canvas绘图 ----- 重点&难点
目录使用Canvas绘制--矩形，矩形定位点在自己的左上角Canvas绘图--文本Canvas绘图--渐变对象Canvas绘图--路径Canvas绘图--图像Canvas绘图--进行变形操作网页中的绘图技术（1）SVG绘图，2D矢量图技术,2000年出现，后纳入H5标准（2）Canvas绘图，2D位图技术，H5提出绘图技术（3）WebGL绘图，3D绘图，尚未...原创 2019-07-27 11:34:04 · 845 阅读 · 0 评论 -
HTML5 新特性之四---SVG绘图(可缩放的矢量图)
canvas绘图 svg绘图 类型 2D位图 2D矢量图 如何绘图 使用JS代码绘图 使用标签绘图 事件绑定 每个图形不是元素，无法直接绑定事件 ...原创 2019-07-27 11:40:22 · 931 阅读 · 0 评论 -
HTML5 新特性之五---第三方的绘图工具库:two.js echarts.js animate.css three.js
1.第三方的绘图工具库：two.js是一个2D绘图函数库，提供一套API, 可以用于绘制不同绘图[Canvas/Svg/WebGL]<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title>...原创 2019-07-27 11:48:56 · 561 阅读 · 0 评论 -
HTML5 新特性之六---地理定位
Geolocation:地理定位，使用JS获取当前浏览器所有地理坐标(经度；纬度；海拔；速度)数据用于实现应用:如饿了么；高德导航手机浏览器如何获取定位信息(1)首选手机中GPS芯片与卫星通信，定位精度在米(2)次选手机通信基站进行定位获取，定位精度公里PC浏览器如何获取定位信息(1)通过IP地址进行反向解析，定位精度取决于IP库HTML5中提供了一个新对象，用于获取...原创 2019-07-27 11:49:46 · 210 阅读 · 0 评论 -
HTML5 新特性之七---拖放API
Drag&Drop拖动和释放 HTML为拖放行为提供了7个事件拖动源对象:(会动)会触发事件(3)dragstart 拖动开始drag 拖动中dragend 拖动结束拖动的目标对象:(不动)=会触发事件(4)dragenter 拖动着进入dragover 拖动着悬停上方dragleave 拖动着离开drop 在上方释放整体过程...原创 2019-07-27 11:50:56 · 208 阅读 · 0 评论 -
HTML5 新特性之八---WebWorker---创建线程
<script> bt.onclick = function () { var val = inputNum.value; var w = new Worker("2.js"); w.postMessage(val); //发送数据到2.js处理 w.onmessage = function (e) { ...原创 2019-07-27 11:51:24 · 143 阅读 · 0 评论 -
HTML5 新特性之九---Web Stroage
在浏览器中存储当前用户专用的数据；访问历史；内容定制，样式定制...在客户端存储数据可以使用的技术（1）Cookie技术：浏览器兼容性好，不能超过4KB，操作复杂（2）Falsh存储：依赖于Flash播放器（3）H5 WebStorage：不能超过8MB，操作简单（4）indexDB：可存储大量数据，还不是标准技术WebStorage技术中，浏览器为用户提供两个对象...原创 2019-07-27 11:52:11 · 139 阅读 · 0 评论 -
HTML5 新特性之十---localStorage
本地存储对象(跨会话级存储)在浏览器能管理外村(磁盘)中存储用户数据，可供此次会话及后续会话的页面共同；及时浏览器关闭了也不会消失---永久存在<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</ti...原创 2019-07-28 10:17:09 · 241 阅读 · 0 评论 -
HTML5 新特性之十一---WebSoket（服务器-客户端）
使用HTML5创建ws协议客户端应用1.连接WS服务器var socket = new WebSocket("ws://127.0.0.1:9001");2.向服务器发送消息socket.send(stringMsg)3.接收服务器发来的消息socket.onmessage=function(e){console.log(e.data);}4.断开到WS服务器连...原创 2019-07-28 10:17:16 · 291 阅读 · 1 评论 -
HTML5 新特性之一 --- 增强型表单
目录(1)新的 input type < input type="?">(2)新的表单元素(3)表单元素的新属性(1)新的 input type < input type="?">h4: text, password, checkbox, radio, submit, reset, button, file, image, hiddenh5: ema...原创 2019-07-27 11:27:26 · 347 阅读 · 0 评论 -
圣杯布局和双飞翼布局
1.两者实现的功能都一样, 都是用于实现两侧的宽度不变, 中间的宽度自适应的三栏布局的2.圣杯布局的步骤2.1搞一个容器, 里面放三个盒子2.2设置两侧盒子的宽度(固定)2.3设置中间盒子的宽度等于容器的宽度(100%)2.4设置容器的padding等于两侧盒子的宽度2.5让三个盒子都在同一个方向上浮动2.6设置左边盒子的margin-left=-100%2.7通过...转载 2019-07-27 11:19:49 · 130 阅读 · 0 评论 -
cssday01 css介绍，css选择器
目录2. CSS介绍3. CSS选择器(重点) 2. 分类 : 2. id选择器 3. 类选择器 4. 群组选择器 5. 后代选择器 6. 子代选择器 7. 通配符选择器 (了解) 8. 伪类选择器3.选择器的优先级1. 容器标签 - 块级元素 <div></div> ...原创 2018-08-09 14:04:11 · 223 阅读 · 0 评论 -
cssday02 尺寸与边框，盒模型，框模型
目录1.尺寸与边框 1.尺寸单位: 2.颜色取值： 3.尺寸属性(overflow) 4.边框(border)2.盒模型/框模型 2.外边距margin 3.内边距padding 盒子模型布局稳定性1.尺寸与边框 1.尺寸单位: 1. px 像素，最常用的单位，也是浏览器默认单位...原创 2018-08-09 14:06:04 · 392 阅读 · 0 评论 -
cssday03 文本字体，表格，列表，css属性过渡效果，浮动(float)，定位(position)
目录1.边框尺寸2.背景属性3.文本/字体属性4.表格属性5.列表属性6.过渡效果7.布局方式(重点掌握) 3.浮动布局（float） 清除浮动 4.定位布局(position) 4.相对定位 5.绝对定位(重点) 6.固定定位 元素堆叠次序1.边框尺寸 1.轮廓...原创 2018-08-09 14:12:59 · 490 阅读 · 0 评论 -
cssday04 转换属性，转换原点，转换函数
目录1.css 转换属性2.转换原点3.转换函数1.css 转换属性 属性 transform 取值 转换函数，如果出现多个转换函数，使用空格隔开2.转换原点 属性 transform-origin 取值 1.关键字 top / bottom / left / right / center 2.使用px 或者 ...原创 2018-08-09 14:16:05 · 633 阅读 · 0 评论 -
(一)HTML
1.前端 web 1.网页 2.网页的运转 1.服务器：用于接收用户请求并响应，提供数据支撑 2.浏览器：电脑上的程序，客户端，帮用户发请求并且处理服务器端返回的数据，图形化呈现给用户 3.通信协议：网络请求最常用的 HTTP HTTPS 3.服务器及浏览器产品 1.服务器：Tomcat Apache Nginx IIS 2.浏览器： 五大浏面结构 文档后缀都是 ...原创 2018-07-31 19:37:16 · 297 阅读 · 0 评论 -
css属性
目录CSS Unicode字体CSS外观属性CSS复合选择器标签显示模式（display） 块级元素(block-level) 行内元素(inline-level)CSS 三大特性CSS 背景(background)盒子模型（CSS重点） 盒子边框（border）内边距（padding）外边距（margin） 盒子模型布局...原创 2018-08-06 21:04:09 · 2486 阅读 · 0 评论 -
cssday05 用户界面样式，web字体
目录CSS用户界面样式 鼠标样式cursor 轮廓 outline 防止拖拽文本域resize vertical-align 垂直对齐 去除图片底侧空白缝隙 溢出的文字隐藏 text-overflow 文字溢出 精灵图web字体 字体格式 字体图标（iconfont) 字体图标优点字体图标使用流程推荐网站：http...原创 2019-04-01 22:35:56 · 156 阅读 · 0 评论 -
html5，css3新特性
目录HTML新标签与特性常用新标签新增的input type属性值：常用新属性多媒体标签CSS3 新增选择器伪元素选择器（CSS3)背景缩放(CSS3)凹凸文字CSS3盒模型过渡(CSS3)2D变形(CSS3) transformvertical-align元素对齐方式线性渐变和径向渐变HTML新标签与特性 HTML: ...原创 2019-04-01 22:57:55 · 4971 阅读 · 0 评论 -
flex布局
目录一.容器的属性1.1 flex-direction属性决定主轴的方向1.2 flex-wrap属性如果一条轴线排不下，如何换行1.3 flex-flow flex-direction属性和flex-wrap属性的简写形式1.4 justify-content属性 项目在主轴上的对齐方式1.5 align-items属性 项目在交叉轴上如何对齐...转载 2019-05-23 17:11:55 · 120 阅读 · 0 评论 -
关于shortcut icon和icon代码的区别介绍
语句一：<link rel="shortcut icon" href="favicon.ico" /> 语句二：<link rel="icon" href="animated_favicon.gif" type="image/gif" /> 备注:语句一 Shortcut Icon 就是在网址列前面出现的Icon问题:语句二 icon的作用是怎...转载 2019-03-14 14:35:54 · 492 阅读 · 0 评论