随笔分类 - CSS
摘要：flex 布局是解决一维的布局问题，grid 布局是解决二维的布局问题 博文推荐 Grid MDN 讲解 Grid 基本用法讲解 Auto-fill vs auto-fit
阅读全文
摘要：最近测试提了一个bug： 在手机上的Safari / Chrome 浏览器上运行web 应用，当用户focus到input 框里面时，此时页面会自动zoom in. 思路： 如何阻止页面自动zoom in 呢？ 解决方案：在应用的index.html 里面添加 maximum-scale=1 <me
阅读全文
摘要：使用场景： 通常情况下我们使用点点点只是针对一行的情况下；也就是说content只能是单行；当content的实际长度超过了容器的长度就用点点点来显示。如下图： 然而，有的需求要求内容允许换行，但行数有限，当行数超过既定的行数的时候，才在内容的最后一行用点点点来替代未显示的内容。如下图： 此时，下面
阅读全文
摘要：Angular-cli创建的项目可以选择css的预处理scss作为style文件的默认预处理格式。scss可以设置变量，函数，同时使用继承，混入等方法达到更方便，通用的效果。 通常情况下，我们会设计一些通用的变量在各个地方使用，如何将通用变量的文件一次引入，全局使用呢？ 解决办法： 这个方法有问题，
阅读全文
摘要：(1) z-index属性只作用在被定位了的元素上。所以如果你在一个没被定位的元素上使用z-index的话，是不会有效果的. (2) 同一个父元素下的元素的层叠效果会受父元素的z-index影响,如果父元素的z-index值很小,那么子元素的z-index值很大也不起作用 (1) z-index属性
阅读全文
摘要：Angular5 项目中遇到：当我在某一个组件的css文件中使用css类选择器去选择组件中的插件元素，发现选择器选择不到该插件元素。 经过google分析发现是组件中的一个属性在作祟： encapsulation. 默认情况下： angular组件对应的css只在该组件下起作用，对于不属于angul
阅读全文
摘要：本文主要讲解如何隐藏scrollbar。 方法一：scrollbar-width （兼容性不好） 利用单一css属性 scrollbar-width设置scrollbar的宽度。 auto is the default value and will render the standard scrol
阅读全文
摘要：1. 利用ai （adobe illustrator 工具）制作一个svg 2. https://www.iconfont.cn/help/detail?spm=a313x.7781069.1998910419.d1c73b2de&helptype=draw&step=
阅读全文
摘要：文章转载于：https://www.cnblogs.com/hjvsdr/p/6639649.html step 1:找到阿里巴巴矢量图标库官网https://www.iconfont.cn,然后注册登录,或者用github登录也行,此步骤跳过; step 2:找到图标管理->我的项目->然后新建项
阅读全文
摘要：flex width flex-grow flex-basis flex-shrink
阅读全文
浙公网安备 33010602011771号