随笔分类 - Css
摘要：vue中使用less 安装less依赖，npm install less less-loader --save vue中使用sass npm install --save-dev sass-loader //sass-loader依赖于node-sass npm install --save-dev
阅读全文
摘要：1. 基础前端开发者 1.1 HTML & CSS 最基础的知识: 语义化的HTML元素 基础的CSS语法 Flexbox & Grid CSS变量 浏览器开发者工具 1.2 响应式布局 响应式设计将不再是网页的加分项, 而是必须的 设置viewport 非固定宽度 媒体查询 使用 rem 替代 p
阅读全文
摘要：（一）-webkit-tap-highlight-color 这个属性只用于iOS (iPhone和iPad)。当你点击一个链接或者通过Javascript定义的可点击元素的时候，它就会出现一个半透明的灰色背景。要重设这个表现，你可以设置-webkit-tap-highlight-color为任何颜
阅读全文
摘要：https://blog.csdn.net/px01ih8/article/details/80780470 一、区分容易混淆的几个属性和值 先区分一下css中的几个属性：animation（动画）、transition（过渡）、transform（变形）、translate（移动）。 CSS3中的
阅读全文
摘要：纯CSS3项目价格表切换代码 - 站长素材 Basic $5 per month Pro $10 per month Premium $20 per month 5 Users ...
阅读全文
摘要：垂直居中是布局中十分常见的效果之一，为实现良好的兼容性，PC端实现垂直居中的方法一般是通过绝对定位，table-cell，负边距等方法。有了css3，针对移动端的垂直居中就更加多样化。 方法1：table-cell html结构： ? 1 2 3 <div class="box box1"> <sp
阅读全文
摘要：纯CSS实现图片水平垂直居中于DIV（图片未知宽高）
阅读全文
摘要：基础说明： 外阴影：box-shadow: X轴 Y轴 Rpx color; 属性说明（顺序依次对应）： 阴影的X轴(可以使用负值) 阴影的Y轴(可以使用负值) 阴影模糊值（大小） 阴影的颜色 内阴影：box-shadow: X轴 Y轴 Rpx color inset; 默认是外阴影 内阴影：ins
阅读全文
摘要：? 1 2 3 4 5 6 7 8 前提修改文档声明，如有疑问，请看文章手机web2.0网页文档属性 @media screen and (max-device-width: 320px){body{-webkit-text-size-adjust:none}} @media screen and
阅读全文
摘要：input::-webkit-input-placeholder{color: #7f7f7f;} select{color: #7f7f7f} option{color: #7f7f7f;}
阅读全文
摘要：rem是根据网页效果图的尺寸来计算的，当然还要借助媒体查询来完成。例如你的设计稿如果是宽720px的话，那你的文字就要以原始大小除以11.25，就是对应下面媒体查询720px；例如16px的话就要16/11.25这样来计算。用之前要把下面这段代码放到你css文件里：@media only scree
阅读全文
摘要：word-wrap是控制换行的。 使用break-word时，是将强制换行。中文没有任何问题，英文语句也没问题。但是对于长串的英文，就不起作用。 word-break是控制是否断词的。 break-all，是断开单词。在单词到边界时，下个字母自动到下一行。主要解决了长串英文的问题。
阅读全文
摘要：http://www.cnblogs.com/xiaohuochai/p/5202761.html 前面的话 display属性在网页布局中非常常见，但经常用到的仅仅是block、inline-block、inline和none等寥寥几个属性值，本文将详细介绍display属性的各个方面 定义 di
阅读全文
摘要：解决方案 1、弹出时给html标签追加height:100% 2、弹出父级元素追加overflow:hidden 3、弹出和遮罩 position:absolute 4、在页面顶部增加fixed ios会固定在顶部，不会出现系统下拉 demo
阅读全文
摘要：中文版Chrome浏览器不支持12px以下字体的解决方案 http://blog.csdn.net/freshlover/article/details/9746821Chrome 27之前的中文版桌面浏览器会默认设定页面的最小字号是12px，英文版则没有限制，主要是因为chrome认为汉字小于12
阅读全文
摘要：行内元素，图片和文字中间有缝隙，需要给父元素设置font-size：0； 图片和文字不对齐，给图片设置vertical-align：top 文字行高有缝隙 设置vertical-align：top
阅读全文
摘要：http://www.w3cplus.com/blog/tags/136.html http://www.w3cplus.com/css/css-sticky-foot-at-bottom-of-the-page .masklayer{width: 100%; height: 100%; posit
阅读全文
摘要：http://www.w3cplus.com/blog/tags/136.html http://www.w3cplus.com/css/css-sticky-foot-at-bottom-of-the-page body { display: flex; flex-flow: column; mi
阅读全文
摘要：去除ios输入框阴影 input,textarea{-webkit-appearance:none; outline: none; } ios有边框时设置boder-radius：0； 去除默认圆角问题
阅读全文
摘要：原理就是利用 overflow:hidden;
阅读全文