Benjamin - 专注前端开发和用户体验

 分类:CSS(3)

CSS2.0+CSS3.0

用 CSS 隐藏页面元素的方式总结

今天看到篇文章”用 CSS 隐藏页面元素的5种方法“,现加上自己的一点见解及常见应用归纳如下: 一、Display 将display设置为none,可以实现元素隐藏,并且不会生成盒模型。使用这个属性,被隐藏的元素不会占用任何空间。一旦给元素设置display:none,任何对...

Benjamin 11个月前 (06-09) 1554℃ 0评论 6 喜欢

Safari :active伪类失效问题

:active伪类,参见CSS2.1 Selector Spec,如果在PC端开发中会经常遇到,当然在某些初级或入门级的面试中也会问到A锚链接元素的几种状态,也许你可能会弄混,:link,:visited,:hover,:active, 常用缩写”LVHA“, 或者更好记忆为...

Benjamin 1年前 (2016-02-21) 1548℃ 0评论 3 喜欢

再聊CSS伪元素

之前写过一篇“CSS伪类和伪元素的异同”的文章,里面详细描述了伪类与伪元素的区别以及一些常见应用。由于最近项目开发中,IE8浏览器下遇到一个bug,再聊伪元素。 我们知道随着CSS规范进一步完善,新增的CSS伪元素越来越多,但是在日常开发中,我们常用的及浏览器支持情况比较乐观的当数before和af...

Benjamin 2年前 (2015-09-25) 2403℃ 0评论 3 喜欢

聊聊Base64

做为一名FE,你肯定用到过base64,谈到base64,你可能会想到以下几点,base64是什么,浏览器如何解析,现有技术如何把图片转换为base64,base64应用场景有哪些,base64如何解码等等,下面就这些问题一一讲述. base64是什么 Base64是网络上最常见的用于传输8Bit字...

Benjamin 2年前 (2015-08-06) 1663℃ 0评论 1 喜欢

placeholder属性多浏览器支持兼容性方案

最近项目开发中遇到不少蛋疼的问题,每一个问题都可单独拿出来探讨,前端领域就是这样,浏览器对标准支持不一,国内IE市场仍有相当的占有率,无端的提高了开发和维护成本。 在本篇文章将来探讨placeholder这个属性,该属性是HTML5提出的一个属性, 占位符的属性值在用户录入数据时用来作为一个简短的提...

Benjamin 2年前 (2015-07-19) 5848℃ 1评论 8 喜欢

前端开发中合理选用图片格式

一、GIF,PNG,JPG图片的不同 在前端开发切图中常常会涉及到好多种图片的保存,具体选用何种格式来保存来保存图片,需要根据图片色彩及大小来选择。具体的对比看下面表格: 类型 压缩方式 色彩通道 透明度 是否支持动画 压缩算法 多图层 PNG-8 无损 索引256色 索引全透明 无 ...

Benjamin 2年前 (2015-03-29) 4576℃ 1评论 4 喜欢

CSS伪类和伪元素的异同

今天在微博上看到一些人在讨论:before 和::before的区别,有些细节问题自己也有些模糊,工作之余翻了下W3C规范,总结如下: 1. W3C CSS 2.1 Selectors 对伪类和伪元素没有做出区分,都是使用一个冒号,详细请戳这里 比如 伪类:first-child, 伪元素:firs...

Benjamin 2年前 (2015-01-20) 2844℃ 2评论 1 喜欢

第一个CSS变量:currentColor

一、基本介绍 CSS变量正慢慢地从最初的草案到浏览器实现。但规范中有个已经存在多年的变量:currentColor。这个CSS特性具有良好的浏览器支持和一些实际的应用,本篇文章,我们来学习和了解它。 引用MDN中的描述: The currentColor keyword represents th...

Benjamin 2年前 (2014-12-02) 2476℃ 0评论 3 喜欢