ClassicSong的博客

都这个时代了，火狐居然不支持text-align:jusitify；可能吗？？？

中午到的公司，昨天加班太晚，上午调休了。项目算是顺利上线。此刻头晕脑胀。做这个项目还是留下了遗憾。如有好的建议，共同讨论。1、因为此项目是在微信里使用，而且页面里的动画有视频的元素，无论是安卓还是IOS有一部分机型，会出现全屏播放视频的情况，那原来的震撼效果，被破坏殆尽。说明：我已经按照查到的资料在video标签里添加了对应的属性（x-webkit-airplay="true" webki

温习了一遍锚点伪类，五个状态，老规则 love and hate  再加一个focus。详细点就是:link, visited,  focus， active, hover，前两个为静态伪类只有超链接才会有，后两个为动态伪类，可以应用于任何元素（后三个的顺序也不能变）。由此想到平时做的项目，按钮、链接元素都是习惯加个默认的样式，再加个hover样式。可是在移动端这个样式却没有那么明显，当用户点

昨天对项目中一个公共组件做响应式优化，忙乎了一天，总算可以了，正准备送去QA测试，遇到问题了，改好的组件放到生产环境自测一下。天呐，在iphone6上为啥页面内容变得好小（其实在iPhone系列都是这样，只是先用手里的设备测试而已）。开始查找页面中的头部是否添加viewport的width设置，果然没有，随即加好，以为问题分分钟解决。页面刷新后，被打了一棒子，并没有想象的美好，依然那么小。难道程序

rem：是一个相对单位，相对根元素字体大小的单位，再直白点就是相对于html元素字体大小的单位。优点：这样在计算子元素有关的尺寸时，只要根据html元素字体大小计算就好。不再像使用em时，得来回的找父元素字体大小频繁的计算，根本就离不开计算器。刚刚做完一个移动端的项目有一些使用的小收获在这里分享一下，也许大家已用过。如果有欠妥的地方，欢迎讨论。html的字体大小

css3实现动画三种方式：Transform 、Transition 、AnimationTransform：只关于形变，位置变。Transition：只关于变的过程，包括元素，时间、方式Animation：是Transform 、Transition的结合。animation使用方式：如下关键帧：@keyframes name{ 0%{ tran

进度条效果如下： 整圆的效果处理会简单些，不完整环实现起来细节多点。下边是实现逻辑和过程。进度条组成：环形：两种颜色进度条，当余量少于50%时进度条颜色由绿色变为黄色。进度条结构由两个叠加环形组成；上叠加环形展示剩余量，深色；下叠加环形展示100%总量，浅色。样式实现：1：画一个方形，如图中阴影部分所示： 2：方形中画两个等大均分方形的矩形，(注意每个矩形一定要设置：o...

拿到个这样的设计稿，蓝色背景图片忽略，注意白线框。切图要求：1、红色框位置1：背景不变。2、红色框位置3：背景不变。3、红色框位置2：背景需要垂直方向重复，即内容不固定，支持垂直方向延展。4、黄色框位置4：放置内容区域。切图方案一：没准会想到简单粗暴的方式，直接切一张大背景就好了，为什么要较劲，不同页面切不同背景。可以直接那么搞，一次性的还好，时不时的让你维护一下内容，可能会惨死。...

需要用到自定义input为radio或者checkbox的样式，如下效果图：html结构：<label class='radio-wrap'> <input type="radio" name="yearsOld"/> <span>15~18岁</spa