随笔分类 -  css

CSS3 实现简单轮播图
摘要：用css3动画实现图片切换效果，原理还是改变left值。只有最简单的自动播放功能，切换后短时间静止，通过最后的位置克隆第一张图片，实现无缝切换。 html结构 css样式 阅读全文

posted @ 2016-08-30 16:33 橙zz 阅读(19248) 评论(0) 推荐(0)

css3实现switch开关效果
摘要：之前阿里电面的时候问的一个问题，今天抽时间做了个demo。 html结构 css代码，:before负责颜色，:after是那个白色小圆点，切换时的过渡效果用css3的动画实现。 阅读全文

posted @ 2016-08-30 14:15 橙zz 阅读(10403) 评论(3) 推荐(1)

Sass的使用和基础语法
摘要：sass安装 官网下载ruby的 "windows安装包" ,安装时勾选上添加到环境变量add ruby executables to your path。安装完成后打开命令行， 输出内容则安装完成。 添加国内sources，安装sass 其他命令 compass安装 Sass基础语法 "官网文档" 阅读全文

posted @ 2016-08-29 16:05 橙zz 阅读(602) 评论(0) 推荐(0)

CSS布局——横向两列布局
摘要：1.固定两栏布局，使用float，注意对紧邻元素清除浮动影响。IE6在使用float布局同时设置横行margin的情况下会有双边距BUG，解决方案是加入_display:inline 代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charse 阅读全文

posted @ 2016-07-25 16:07 橙zz 阅读(1897) 评论(0) 推荐(0)

CSS布局——居中
摘要：参考文章1.CSS布局奇淫技巧之--各种居中 2.http://www.imooc.com/article/2235 1.行内元素水平居中text-align:center对图片，按钮，文字等行内元素(display为inline或inline-block等)进行水平居中，可对元素或者父元素使用te 阅读全文

posted @ 2016-07-25 14:34 橙zz 阅读(573) 评论(0) 推荐(0)

导航