介绍一个无需HTML标签就能控制任意字符字号大小的CSS技术,关键时候说不定可以救命,都来学学吧。
文章关键字 ‘font-size’
使用CSS size-adjust和unicode-range改变任意文字尺寸
2022年03月27日,星期日纯CSS实现未读消息超过100自动显示为99+
2022年01月14日,星期五分享下input time输入框的细节知识
2021年03月31日,星期三常见纯CSS图标的代码分离与整理(持续更新)
2019年08月13日,星期二以20像素为基准的CSS网页布局实践分享
2016年03月22日,星期二以20像素为基准进行CSS网页布局,说不定会让一些细节和潜能大放光彩,当然这需要体系的配合,还需要一些完整的解决方案在里面,本文就将分享这一实践心得,保证是其他地方都没有的。外甥点灯笼——照旧(舅),有demo有截图有必要的源代码展示,希望本文的内容能够对您的学习有所帮助!
拜拜了,浮动布局-基于display:inline-block的列表布局
2010年11月3日,星期三
对于浮动局部的局限性,想必同行们都知道,就是每个列表元素的高度必须要一致,否则就会像是俄罗斯方块一样,“锯齿相错”,例如一个左浮动列表布局,如果第一行有个列表高度高于其他列表,那就在第二行,第一个元素会沿着最高元素的右侧对齐。
浮动本身就是个魔鬼,所以,使用浮动布局还需要修复其带来的副作用——高度塌陷的问题,也就是常提到的“清除浮动”了。
另外,IE6下,重复的列表元素会出现莫名的bug,例如出现不知哪来的文字。
而基于display:inline-block的列表布局可以避免这些问题,本文就将一步一步地展示基于display:inline-block的列表布局的可用性以及价值所在。本文内容较多,讲解详细,配以丰富飞截图,必要的demo页面。还是视频展示,希望能对您的学习有所帮助。
jQuery之replace字符串替换实现不同尺寸图片切换
2009年08月30日,星期日学习是需要积累的,即使是一个函数,只要肯想,会实现不少好的效果的。这里,就是活用了一个replace字符串替换实现了大小图片切换的效果。
实现的效果有点类似于Google picasa相册不同尺寸图片的切换效果。本实例通过文字大小(font-size)控制图片尺寸的做法是跟Google学习的,但是jQuery代码是根据效果自己想出来的,逻辑很简单,没有什么精妙之处。核心就是使用replace替换img src的图片路径,从而实现不同尺寸图片的切换。
这里重要的其实是图片大小切换效果,里面所蕴含的前端知识还是很多的,可以说将Google的picasa相册图片大小切换实现给提炼简化出来了。
提供实例页面和源文件打包下载,希望能对您有所帮助。