css
关注
分享
扫一扫
码页面
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
CSS总结
盒模型页面渲染时，dom元素所采用的 布局模型，可以通过 box-sizing 进行设置，根据计算高度的区域可分为：content-box （W3C 标准盒模型）border-box （IE盒模型）// content-box div大小为 140 * 140，内容盒大小为 100 * 100div { width: 100px; height: 100px; ...原创 2019-09-19 10:21:43 · 129 阅读 · 0 评论 -
css3旋转木马效果
css3旋转木马效果<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>旋转木马效果</title></head><style> #app{ position: relative; width: ...原创 2019-09-14 11:54:47 · 467 阅读 · 0 评论 -
单页应用（SPA）和 多页应用（MPA）
单页应用（SPA）第一次进入页面的时候会请求一个html文件，刷新清除一下。切换到其他组件，此时路径也相应变化，但是并没有新的html文件请求，页面内容也变化了。原理：JS会感知到url的变化，通过这一点，可以用js动态的将当前页面的内容清除掉，然后将下一个页面的内容挂载到当前页面上，这个时候的路由不是后端来做了，而是前端来做，判断页面到底是显示哪个组件，清除不需要的，显示需要的组件。这种过程...原创 2019-08-14 10:35:09 · 196 阅读 · 0 评论 -
dom元素和class常用操作
创建document.createElement()document.createTextNode()克隆document.cloneNode()删除removeChild()替换replaceChild(newnode,oldnode)插入appendChild()insertBefore()把节点插入到父节点的某个兄弟节点的前面。所以他有两个参数，insertB...原创 2019-08-09 10:39:57 · 2276 阅读 · 0 评论 -
vue项目解决ie兼容问题
原因是ie不支持es6语法，需要导入依赖包1、npm install --save-dev babel-polyfill2、在main.js中引入： import 'babel-polyfill'原创 2019-08-13 15:35:30 · 462 阅读 · 0 评论 -
div模拟微信输入效果
<div class="main"> <div class="chat-content" id="chat-content"> </div> <div class="chat-ques"> <div contenteditable="true" class="input" v-text="inputData" ref="input" ...原创 2019-07-18 18:12:32 · 330 阅读 · 0 评论 -
命名规范
class命名规范常见class关键词布局类：header, footer, container, main, content, aside, page, section包裹类：wrap, inner区块类：region, block, box结构类：hd, bd, ft, top, bottom, left, right, middle, col, row, grid, span列...转载 2019-04-22 13:39:37 · 381 阅读 · 0 评论 -
css自定义滚动条样式
// An highlighted block.system-sub-slidebar::-webkit-scrollbar { width: 10px; height: 10px;}.system-sub-slidebar::-webkit-scrollbar-button { background-color: #11151d;}.system-sub-s...原创 2019-04-22 13:40:13 · 262 阅读 · 0 评论 -
前端学习笔记
CSS/CSS3**HTML/HTML5html5新特性 canvas、SVG、拖放（Drag 和 Drop）、Geolocation（地理定位）、Video(视频)、Audio(音频)、localStorage 和 sessionStorage 、应用程序缓存（Application Cache）、WebSocket****cookie与localStorage...原创 2019-04-22 18:08:49 · 142 阅读 · 0 评论 -
css3 加载动画
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>loading</tit原创 2018-04-14 16:11:27 · 253 阅读 · 0 评论 -
css3动画速度曲线
语法一animation-timing-function: value;value: linear 动画从头到尾的速度是相同的。 ease 默认。动画以低速开始，然后加快，在结束前变慢。 ease-in 动画以低速开始。 ease-out 动画以低速结束。 ease-in-out 动画以低速开始和结束。 cubic-bezier(n,n,n,n) 在 cub原创 2018-02-02 09:38:50 · 9969 阅读 · 0 评论 -
纯css实现宽高等比缩放
宽高比始终保存5：3div{ padding-bottom: 60%; width: 100%; height: 0; background: red;}div>div>原创 2018-02-01 16:19:50 · 6552 阅读 · 0 评论