- 博客(8)
- 资源 (1)
- 收藏
- 关注
转载 css3 display 详解
你一定不敢相信display有32种写法,今天我们就一一道来,让你一次性掌握display从大的分类上讲,display的32种写法可以分为6个大类,再加上一个全局类,一共是7个大类:1 外部值2 内部值3 列表值4 属性值5 显示值6 混合值7 全局值一 外部值所谓外部值,就是说这些值只会直接影响一个元素的外部表现,而不影响元素里面的儿子级孙子级元素的表现。 d...
2019-07-04 17:09:24
496
转载 ::-moz-focus-inner
对于点击某些元素后出现的边框,去除的办法是button:focus { outline: none;}另外还可以将outline属性设置为0button:focus { outline: 0;}但是在Firefox下,对于类型为button的元素,即使设置outline,也还是会出现虚线。这里写图片描述解决方法用一个Firefox的私有伪元素button...
2019-07-04 14:12:42
198
转载 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
577
转载 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
144
转载 盒模型与box-sizing
盒模型概念网页设计中常听的属性名:内容(content)、填充(padding)、边框(border)、边界(margin),CSS盒子模式都具备这些属性。*CSS盒子模型就是在网页设计中经常用到的CSS技术所使用的一种思维模型。盒模型的出现彻底终结了用表格制作网站的历史,当然表格table并没有完全退出舞台,它的功能特性是其他标签替代不了的,而且它还有一个十分重要的设计思想成功解决了...
2019-07-02 14:36:56
156
转载 弹性盒模型
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
85
转载 css3模拟单选框
我们可以用个简单的span标签(当然你也可以用其他标签)来模拟原生的单选框,大概原理就是,先使用label标签将原生单选框、用于模拟单选框的span标签以及文字包起来,并将原生单选框隐藏,然后再使用:checked伪类和+选择器来给span标签加选中样式。上面GIF图中美化单选框的具体代码如下:作者:前端王睿链接:https://www.jianshu.com/p/9f5ec459f893...
2019-05-08 11:29:05
312
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人