html5+css
写代码的小珊子
这个作者很懒,什么都没留下…
展开
-
几种css小技巧
1、画三角形//html<div class="box"> <div class="box-inner"> <div class="triangle bottom"></div> <div class="triangle right"></div> <div class="triangle top"></div> <div class="triangle left"></d原创 2022-03-24 14:29:28 · 247 阅读 · 1 评论 -
界面自适应大小(rem与px之间的转换)
下面的例子中,100px=1rem\//界面自适应大小function viewAutoSizeInit(w) { getRem(w, 100); window.onresize = function () { getRem(w, 100); }; function getRem(width, rem) { $("html").css({ 'font-size': ($('body').width() / width * rem + "px原创 2020-10-16 11:03:32 · 381 阅读 · 0 评论 -
关于设置透明度问题
关于设置透明度问题我们在设置网页时经常会遇到要设置透明度的问题,通常我们的方法是设置其样式opacity的大小。例如:div{opactiy:0.5},除了这种方法我们还可以使用h5中的新标签canvas,它可以设置透明度的方向:①createLinearGradient(x,y,x1,y1) - 创建线条渐变②createRadialGradient(x,y,r,x1,y1,r1) - 创...原创 2019-08-04 12:42:48 · 559 阅读 · 0 评论 -
html5表单新增事件
HTML5表单的新增事件1.Onlinput:监听当前指定内容的改变,只要内容改变(添加内容,删除内容)就会被触发这个事件2.Onkeyup:键盘弹起的时候,每一个键的弹起都会触发一次3.Oninvalid:当验证不通过时触发...原创 2019-09-25 22:44:57 · 299 阅读 · 0 评论 -
html5+css3时钟效果案例
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; } .clock{ ...原创 2019-09-25 22:48:02 · 320 阅读 · 0 评论 -
html5+css3立体正方形效果案例
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> *{ padding: 0; margin: 0; } .box{ ...原创 2019-09-25 22:51:16 · 1733 阅读 · 0 评论