“中秋”项目总结

继第一次接触活动项目黄金星期三、充值活动之后,感觉顺手起来,速度也变快了N倍,嘿嘿嘿~特别是在和PHP的交互上,也有一些自己的概念。

花好月圆庆中秋

像以前一样,总结下收获吧,这次主要一些新学的东西和技巧:


1. 有见过script的这个type吗?

<script type="text/x-tmpl">  

浏览器会认为这不是一个Script脚本,不会去解析执行里面的内容。


2. 新学到的两个技巧

(1) 列表序号突出的CSS实现方法

active

实现方法如下:

 padding-left: 30px;  
 text-indent: -30px;  

就是一开始没有想到呀!

(2) 圆形根据内容变宽成椭圆形

圆形椭圆形

html部分:

<div class="mkq">  
    <span class="mkq2">2333</span>
</div>  

css部分:

.mkq {  
    width:20px;  
    height: 20px;  
}  
.mkq2 {  
    background: #000;  
    min-width: 20px;  
    height: 20px;  
    border-radius: 10px;  
    color:#fff;  
    text-align:center;  
    display: block;  
    position:absolute;
}  

演示地址:http://codepen.io/makaiqian/pen/bKhpA

兼容性:如果要兼容ie 6,那border-radius的圆角效果就要用背景图片来取代。然后再加一层,用背景图片取右半球,根据中间text的宽度向右撑开。

麻凯倩

微信:makaiqian,请备注来源“博客”并介绍自己。

总访问量: 总访客数: 备案号:浙ICP备15036547号-1