随笔分类 - css&&css3
摘要：日期数组时间轴显示 效果图 <template> <div> <div class="time-line"> <span>小时的时间轴显示</span> <div class="time-box"> <div v-for="(item,index) in dateList" class="time-
阅读全文
摘要：盒子垂直左右居中方法 方法1(不常用) <!DOCTYPE html 盒子垂直左右居中 .box{ width:1000px; height:500px; border:1px solid 000; margin:0 auto; display:flex; } .box div{ width:200
阅读全文
摘要：弹性网络(删格系统) sm 小屏幕 md 中屏幕 lg 大屏幕 响应式图片 给img的宽度 设置为 100% 使用background image 配合 padding top/background size 使用 `` 标签。 使用 pricturefill.js 插件 使用插件实现图片拖动 wi
阅读全文
摘要：制作旋转小风车 一 我先搭建一个大盒子400x400px大盒子里面嵌套四个小盒子200x200px,放在一起肯定是四个排在一行,我想要的效果是上下各两个, { margin:0; padding:0; } box{ display:flex;/ 将容器设置为伸缩盒,和设置float效果一样 / fl
阅读全文
摘要：viewport 定义 可视区域 移动端:布局视口(大部分980px)/理想视口(视口宽度=设备宽度) 设置 设置选项 width 视口宽度 通常设置为device width height 视口高度 initical calse 初始化缩放比例 maximum scale 最大缩放比例 minim
阅读全文
摘要：WEB字体 语法 @font face{ font family:""; src:url() format() ... } 兼容性写法 @font face { font family: 'diyfont'; src: url('diyfont.eot'); / IE9+ / src: url('d
阅读全文
摘要：css3 变形/变换 相关属性 transform transform origin transform style:flat/preserve 3d perspective: 长度单位 perspective origin观察者的位置 backface visibialbe:visible/hid
阅读全文
摘要：边框 圆角 border radius border top left radius border top right radius border bottom left radlius border bottom right radius 盒子阴影 box shadow box shadow:5p
阅读全文
摘要：css3 选择器 基础选择器 通配符选择器 ID选择器 ID class选择器 .classname 元素选择器 tagName 群组选择器 selecter,selecter 层次选择器 后代选择器 &nb
阅读全文
摘要：css3 私有前缀 webkit chrome/safari等webkit内核浏览器 moz firfox o opera ms IE css3 盒子模型 box sizing 值content box/border box content box(默认) border box(不会增加paddin
阅读全文
摘要：DIV+CSS布局 行内元素和块状元素 块状元素独占一行，行内元素可以共用一行 默认宽度： 块状元素默认宽度由父元素决定 行内元素默认宽度由内容决定 块状元素可以设置宽高，行内元素不可以设置宽高 大部分块状元素内部可以嵌套块状或行内，大部分行内只能嵌套行内 外边距，块状没问题，行内只能设置左右 盒子
阅读全文
摘要：css层叠样式表 css的使用方式 在元素的style属性内 行内样式 内联样式 写在`
阅读全文