前端
ﺭ并哈哈大笑踹了你一脚ﺭ小可爱
这个作者很懒,什么都没留下…
展开
-
瀑布流布局思路
瀑布流 waterFull原创 2018-11-23 15:10:24 · 191 阅读 · 0 评论 -
css3模拟单选框
我们可以用个简单的span标签(当然你也可以用其他标签)来模拟原生的单选框,大概原理就是,先使用label标签将原生单选框、用于模拟单选框的span标签以及文字包起来,并将原生单选框隐藏,然后再使用:checked伪类和+选择器来给span标签加选中样式。上面GIF图中美化单选框的具体代码如下: 作者:前端王睿 链接:https://www.jianshu.com/p/9f5ec459f893 ...转载 2019-05-08 11:29:05 · 296 阅读 · 0 评论 -
弹性盒模型
1)box-orient:用来确定子元素的方向。是横着排还是竖着走。 2)box-direction:用来确定子元素的排列顺序,即是否反转。 3)box-pack:用来确定子元素的左右对齐方式。 4)box-align:用来确定子元素的上下对齐方式。 5)box-flex:用来确定子元素如何分配其剩余元素。子元素的尺寸=盒子的尺寸*子元素的box-flex属性值 / 所有子元素的box-flex属...转载 2019-05-09 17:30:53 · 81 阅读 · 0 评论 -
盒模型与box-sizing
盒模型概念 网页设计中常听的属性名:内容(content)、填充(padding)、边框(border)、边界(margin), CSS盒子模式都具备这些属性。* CSS盒子模型就是在网页设计中经常用到的CSS技术所使用的一种思维模型。 盒模型的出现彻底终结了用表格制作网站的历史,当然表格table并没有完全退出舞台,它的功能特性是其他标签替代不了的,而且它还有一个十分重要的设计思想成功解决了...转载 2019-07-02 14:36:56 · 149 阅读 · 0 评论 -
font-smoothing
body,html{ -webkit-font-smoothing: antialiased; /*chrome、safari*/ -moz-osx-font-smoothing: grayscale;/*firefox*/ } 针对图标字体进行抗锯齿渲染。 font-smoothing是非标准的CSS定义。它被列入标准规范的草案中,后由于某些原因从web标准中被移除了。 使用:(1)We...转载 2019-07-02 14:50:32 · 127 阅读 · 0 评论 -
CSS3 鲜为人知的属性-webkit-tap-highlight-color的理解
(一)-webkit-tap-highlight-color 这个属性只用于iOS (iPhone和iPad)。当你点击一个链接或者通过Javascript定义的可点击元素的时候,它就会出现一个半透明的灰色背景。要重设这个表现,你可以设置-webkit-tap-highlight-color为任何颜色。 想要禁用这个高亮,设置颜色的alpha值为0即可。 示例:设置高亮色为50%透明的红色: -w...转载 2019-07-02 15:23:42 · 566 阅读 · 0 评论 -
::-moz-focus-inner
对于点击某些元素后出现的边框,去除的办法是 button:focus { outline: none; } 另外还可以将outline属性设置为0 button:focus { outline: 0; } 但是在Firefox下,对于类型为button的元素,即使设置outline,也还是会出现虚线。 这里写图片描述 解决方法 用一个Firefox的私有伪元素 button...转载 2019-07-04 14:12:42 · 175 阅读 · 0 评论 -
css3 display 详解
你一定不敢相信display有32种写法,今天我们就一一道来,让你一次性掌握display 从大的分类上讲,display的32种写法可以分为6个大类,再加上一个全局类,一共是7个大类: 1 外部值 2 内部值 3 列表值 4 属性值 5 显示值 6 混合值 7 全局值 一 外部值 所谓外部值,就是说这些值只会直接影响一个元素的外部表现,而不影响元素里面的儿子级孙子级元素的表现。 d...转载 2019-07-04 17:09:24 · 465 阅读 · 0 评论