用CSS3把列表项目反转显示
忘了哪儿的一个题目来着,说是把 一个列表 给翻转序列显示,比如 :
有一个列表如图:
翻转为 
回复里面有人机智的使用 CSS3 的 transform:rotate(180deg); 实现了,引发众人赞叹。
其实除了这种方法,还有其他的CSS3属性可以做到。今天在看 张鑫旭的这篇文章 的时候 发现 box-direction:reverse; 这个属性就很适合
废话不说 直接上 DEMO 细心的人可以比对出两种方案效果的差别。
用Chrome 打开,只对Chrome写了前缀。PS: 编写DEMO的时候 利用 pre style, pre script{ display:block;} 再加以格式化 真是好便捷~
结论:CSS3很强大,好多属性可以挖掘,赞别人的解决方案之余别禁锢了自己尝试解决问题的能力。
用CSS3把列表项目反转显示的更多相关文章
- 使用CSS3滤镜让图片反转颜色
CSS提供的滤镜也是一大亮点,我一直痴迷其中,有些滤镜的效果很有用,可是有些的滤镜效果可能只是为了玩玩儿,CSS常见的滤镜有这些:grayscale, blur, sepia,所有常见的过滤器.但是如 ...
- CSS3鼠标悬停图片上浮显示描述代码
效果:http://hovertree.com/texiao/css3/20/ 效果图: 代码如下: <!doctype html> <html lang="zh" ...
- SharePoint 2013 搜索功能,列表项目不能完全被索引
描述 最近一个站点,需要开启搜索功能,然后创建内容源,开始爬网,发现列表里只有一部分被索引,很多项目没有被索引,甚是奇怪,如下图(其实列表里有80几条项目). 首先爬网账号是系统账号.服务器管理员,所 ...
- 在xcode运行编译时,编译成功,但项目中显示缺少该文件,这是只要关闭重启xcode即可。
在xcode运行编译时,编译成功,但项目中显示缺少该文件,这是只要关闭重启xcode即可.
- 基于css3的鼠标经过动画显示详情特效
之前为大家分享过一款基于jquery的手风琴显示详情,今天给大家分享基于css3的鼠标经过动画显示详情特效.这款实例鼠标经过的时候基于中间动画放大,效果非常不错,效果图如下: 在线预览 源码下载 ...
- PyCharm(二)——PyCharm打开本地项目不显示项目文件
一.问题描述 1.1.系统及软件环境 系统:windows10 64位企业版 软件:PyCharm2018.1.4 1.2.问题现象 现象: PyCharm之前一直正常. 从github克隆了一个项目 ...
- Android Studio 点运行启用时,列表中不显示虚拟机,但是实际上在AVD Manager中已经添加了2个虚拟设备了
Android Studio 点运行启用时,列表中不显示虚拟机,但是实际上在AVD Manager中已经添加了2个虚拟设备了 百度上找了一下方法, 情况出现:打开androidstudio,一直连接不 ...
- 夺命雷公狗ThinkPHP项目之----企业网站26之网站前台列表页的显示和完成分页功能
我们用大I接收到我们get过来的栏目页的id然后通过文章的ar_cateid 来判断是不是属于该栏目下的,如果文章表ar_cateid = 栏目表的cate_id 那么就可以选出我们要查找的信息, 然 ...
- Python 列表反转显示方法
第一种,使用reversed 函数,reversed返回的结果是一个反转的迭代器,我们需要对其进行 list 转换 listNode = [1,2,3,4,5] newList = list(reve ...
随机推荐
- iOS - OC - 网络请求 - 中文转码
#import "ViewController.h" @interface ViewController () @end @implementation ViewControlle ...
- Spring框架管理开源的连接池
1. 管理DBCP连接池 * 先引入DBCP的2个jar包 * com.springsource.org.apache.commons.dbcp-1.2.2.osgi.jar * com.spring ...
- jQuery控制TR显示隐藏
参考链接:http://www.jb51.net/article/51221.htm 通过jQuery的hide和show方法即可.
- mvc view获取url参数
视图页面直接获取url get传值, 1.@Request.QueryString["look"] 2.@ViewContext.RequestContext.HttpContex ...
- tomcat内存溢出问题解决思路
.修改启动时内存参数.并指定JVM时区 (在windows server 下时间少了8个小时) 在Tomcat上运行j2ee项目代码时,经常会出现内存溢出的情况,解决办法是在系统参数中增加系统参数: ...
- 挪过来的spring mvc 的入门 介绍
目录 一.前言二.spring mvc 核心类与接口三.spring mvc 核心流程图 四.spring mvc DispatcherServlet说明 五.spring mvc 父子上下文的说明 ...
- 利用ks构建ISO中的一些坑
构建ISO的基本流程 1.获取rpm包源码 2.将源码增量编译成二进制包 3.编写ks的包列表决定ISO制作时需要从什么地方(二进制仓库repo)取哪些二进制包 4.通过createiso命令并指定k ...
- 使用phpExcel导出excel文件
function export($log_list_export) { require "../include/phpexcel/PHPExcel.php"; require &q ...
- MySql 几个小技巧
分页查看: 在 mysql 环境下,执行命令: pager more,之后的结果分屏了. 简明扼要地查看表结构: describe table_name
- postman模拟登录接口
https://blog.csdn.net/qq_22219911/article/details/80235272