css设置下拉列表select的padding值

话说这原生select标签,在每个浏览器中自是各有各的面相,也只接受少数css属性的打扮,Safari里的select最为顽固,坚持素颜绝不动摇。可是艺术感超强的设计师们可不会将就,于是,聪明的程序员哥哥们开发了各种各样的select美化插件,许多杰作操作简单,灵活多变,美轮美奂,膜拜中。。。

近来遇到的一个问题是,需求只是要给select加上边内补白,就是padding啦,FF、Chrome、IE都很给力,而Safari里根本不起作用啦!如果装个美化插件,感觉有点像是拿大炮打蚊子,还得麻烦程序员哥哥去读插件的使用文档,出了问题要我提头去见(夸张),原生select多简单哪!

text-indent可以使select里的文本缩进,也能实现左边内补白的效果。可是右边被切掉了啊啊啊。。。如图:readmore

响应式图片切换加载方式

作为一个PS保存图片时,在图片质量和大小之间周旋良久的前端小妹,实在不能忍受响应式页面需要同时加载桌面版和手机版所需的图片或资源。那么多图片,得要拖慢多少时间?得要耗费多少流量?!好吧,我承认我总是要么很迷糊要么很爱钻牛角尖。。。

加载图片要么img标签,要么写在css背景图片里。

如果桌面版需要加载这三张大图(实际宽940px,高400px,下图已缩小做展示用):

readmore

Quote

响应式设计移动优先原则(mobile first)

起初,响应式设计以桌面版为重点,并自适应小屏幕尺寸,如缩小图片,隐藏不必要内容。而最近一种创新的移动优先的响应式设计方式开始悄然流行。

相比从大的、臃肿的桌面版开始设计并不断缩小、丢弃内容以适应小屏幕设备,从移动优先显得更有意义。移动优先有个很重要的优势,就是你可以将注意力集中在网页的核心内容,也就是内容优先,无需将精力分散在侧边栏那些不是必不可少的元素上。

“At readmore