HTML5-CSS3
文章平均质量分 93
HTML5-CSS3
随记123
一起学习叭
展开
-
05 - HTML 5的绘图技术
第一步:获得上下文(笔) =>canvasElem.getContext('2d');第二步:开始路径规划 =>cxt.beginPath();第三步:移动起始点 =>cxt.moveTo(x, y);第四步:绘制线(线条、矩形、圆形、图片...) =>cxt.lineTo(x, y);第五步:闭合路径 =>cxt.closePath();第六步:绘制描边 =>cxt.stroke();案例:通过上面所学的方法绘制一个三角形。原创 2024-06-03 09:27:55 · 851 阅读 · 0 评论 -
05-弹性盒子模型
如果一个项目的flex-grow属性为2,其他项目都为1,则前者占据的剩余空间将比其他项多一倍。如果所有项目的flex-shrink属性都为1,当空间不足时,都将等比例缩小。如果一个项目的flex-shrink属性为0,其他项目都为1,则空间不足时,前者不缩小。flex属性是flex-grow, flex-shrink 和 flex-basis的简写,默认值为0 1 auto,后两个属性可选。项目默认沿主轴排列。flex-shrink属性定义了项目的缩小比例,默认为1,即如果空间不足,该项目将缩小。原创 2024-06-03 09:22:17 · 757 阅读 · 0 评论 -
02-CSS3基本样式
如同人类的的进化一样,CSS3是CSS2的“进化”版本,在CSS2基础上,增强或新增了许多特性, 弥补了CSS2的众多不足之处,使得Web开发变得更为高效和便捷。原创 2024-05-30 14:57:34 · 1315 阅读 · 0 评论 -
03-CSS3中2D和3D的使用
那么transformZ的值越接近200,就是离的越近,看上去也就越大,超过200就看不到了,因为相当于跑到后脑勺去了,我相信你正常情况下,是看不到自己的后脑勺的。transform是CSS3中具有颠覆性的特征之一,可以实现元素的位移、旋转、倾斜、缩放,甚至支持矩阵方式,配合过渡和即将学习的动画知识,可以取代大量之前只能靠Flash才可以实现的效果。[注意]其中,x和y可以是长度值,也可以是百分比,百分比是相对于其本身元素水平方向的宽度和垂直方向的高度和;可以对元素进行水平和垂直方向的缩放。原创 2024-05-30 15:11:31 · 1072 阅读 · 0 评论 -
04-媒体查询
原理就是在不同屏幕下,通过媒体查询来改变这个布局容器的大小,再改变里面子元素的排列方式和大小,从而实现不同屏幕下,看到不同的页面布局和样式变化。@media 可以针对不同的屏幕尺寸设置不同的样式,特别是如果你需要设置设计响应式的页面,@media 是非常有用的。使用CSS3 @media查询,你可以针对不同的设备类型以及设备的不同特性,定义不同的样式。就是使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而适配不同设备的目的。当你重置浏览器大小的过程中,页面也会根据浏览器的宽度和高度重新渲染页面。原创 2024-05-30 15:13:56 · 457 阅读 · 0 评论 -
04-移动端开发及布局
原生应用由于利用的是官方提供的语言和工具并且能够直接操控硬件设备(比如多点触控、NFC、读取短信等),在应用性能上和交互体验上应该是最好的,但是原生应用的可移植性比较差,特别是一款原生的App,Android和IOS都要各自开发,同样的逻辑、界面要写两套。现在还可以利用uniapp,进行更多平台的支持。混合应用开发正是结合原生和H5开发的技术,取长补短的一种开发模式,原生代码部分利用WebView插件或者其它的框架为H5提供了一个容器,程序主要的业务实现、界面展示是利用H5相关的Web技术进行实现的。原创 2024-05-30 15:19:04 · 729 阅读 · 0 评论 -
06-HTML5新增API-Storage对象
所谓的端口,就好像是门牌号一样,客户端可以通过ip地址找到对应的服务器端,但是服务器端是有很多端口的,每个应用程序对应一个端口号,通过类似门牌号的端口号,客户端才能真正的访问到该服务器。通过sessionStorage存储的数据有效期和存储数据的脚本所在的最顶层的窗口或者是浏览器标签页是一样的。同源策略是浏览器的行为,是为了保护本地数据不被JavaScript代码获取回来的数据污染,因此拦截的是客户端发出的请求回来的数据接收,即请求发送了,服务器响应了,但是无法被浏览器接收。原创 2024-05-30 15:31:06 · 631 阅读 · 0 评论 -
06-HTML5新增API
相同点:(1)共同的参数,(2)不会刷新页面只是修改或喜欢历史记录。pushState会在history中添加一个新的记录( replace不会添加新的history记录,而是替换当前的url。原创 2024-05-30 15:35:52 · 968 阅读 · 0 评论 -
01-HTML5新标签与特性
HTML5 : HTML 标准的最新版本,是对 HTML 的第五次重大修改。HTML5的出现,对于WEB来说意义重大,其目的是想要把目前WEB中存在的各种问题一并解决掉。两个概念:是一个新版本的 HTML语言,定义了新的标签、特性和属性。拥有一个强大的技术集,这些技术集是指: HTML5CSS3、javascript, 这也是广义上的 HTML5总之:HTML5就是对HTML4已有标签属性的删除和增加,另外又增加了新的多媒体等标签,解决目前WEB上存在的问题。原创 2024-05-30 09:37:34 · 678 阅读 · 0 评论