.imageList{
overflow-x: auto;
overflow-y: hidden;
height:180px;
white-space: nowrap;
img{
width:auto;
height:100%;
margin-right:10px;
}
}
<div class="imageList">
<img src="1.jpg"/>
<img src="2.jpg"/>
<img src="3.jpg"/>
<img src="4.jpg"/>
<img src="1.jpg"/>
</div>

这里注意,img标签不能左浮动,外层容器必须加不换行

white-space: nowrap;

css实现图片横向排列滚动的更多相关文章

  1. CSS + ul li 横向排列的两种方法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. div+css+jQuery图片横向滚动代码(带左右点击按钮)

    首先感谢Blue老师的javascript教程,给了我很多的启发,这是我在看完10 - 定时器的使用 - 2这节视频后,自己试着用jQuery重新改写了一下代码,感觉至少比百度搜出来的那一坨靠谱多了, ...

  3. css ul li 横向排列

    因为li是块级元素,默认占一行的,要想实现横向排列,一般通过以下两个方法:float:left这样设置有一个问题,li浮动以后则脱离了文本流,即不占位置,如果它的父级元素有具体的样式且没有固定宽高,建 ...

  4. css如何将图片横向平铺?

    在CSS中,可以使用background(背景)属性来添加图片,默认图片是向x轴和y轴重复.那么css如何将图片横向平铺?下面本篇文章就来给大家介绍一下使用CSS将图片横向平铺的方法,希望对大家有所帮 ...

  5. DIV+CSS图片不间断滚动jquery特效(Marquee插件)及移动标签marquee整理

    推荐一个jQuery的无缝文字滚动效果,同时也可以滚动图片,也叫做跑马灯效果. 此jquery插件,依托jquery库,能实现各种滚动效果,且让HTML代码符合W3C标准. marquee标签:创建一 ...

  6. 可以左右移动横向无缝滚动的JS图片展示代码

    在酷站网站下的,具体路径忘了,稍微改了一下,让它看起来像组滑动 1)被引用的js文件ScrollPic.js ?){){i+=l.length;)I=document.cookie.length;o= ...

  7. 横向排列两个多个div盒子的方法(CSS浮动清除float-clear/inline)/办法

    最近在做一个div css切割,昨晚发现了长期以来一直无记录下来的问题!关于兼容IE跟FF的float属性.趁现在还清醒赶紧记下笔记先:一.并排在一行的两个div样式有这种情况:ie或者ff下对于子d ...

  8. flash滑杆控制图片横向滚动

    flash滑杆控制图片横向滚动是一款FLASH动画图片左右滚动素材,滑杆控制滚动,效果很酷,带FLASH源文件. 下载:http://www.huiyi8.com/sc/9452.html

  9. 你所不知道的 CSS 阴影技巧与细节 滚动视差?CSS 不在话下 神奇的选择器 :focus-within 当角色转换为面试官之后 NPOI 教程 - 3.2 打印相关设置 前端XSS相关整理 委托入门案例

    你所不知道的 CSS 阴影技巧与细节   关于 CSS 阴影,之前已经有写过一篇,box-shadow 与 filter:drop-shadow 详解及奇技淫巧,介绍了一些关于 box-shadow  ...

随机推荐

  1. Unable to locate \.nuget\NuGet.exe 问题解决办法之一(转)

    问题出现的原因是项目下.nuget文件夹下NuGet.exe文件夹不存在导致的 解决办法: 1.右键编辑NuGet.targets文件 将下载NuGet.exe的配置节点DownloadNuGetEx ...

  2. Springmvc 定时器的实现

    有时候会需要项目中,定时去执行一些东西,这个时候就需要用到定时器了.比较简单, 当你springmvc环境搭建成功的时候. 本文转载自:https://www.cnblogs.com/wqj-blog ...

  3. [转]Oracle存储过程给变量赋值的方法

    原文地址:http://blog.csdn.net/drbing/article/details/51821262 截止到目前我发现有三种方法可以在存储过程中给变量进行赋值:1.直接法     :=  ...

  4. redis关闭/重启服务器

    通过docker实现: 一.创建redis服务器与客户端 docker run -p : -d --name redis-server docker.io/redis: redis-server -- ...

  5. Route学习笔记之Area的Route注册

    前一段时间接触了MVC的Area可以将模型.控制器和视图分成各个独立的节点.分区之后,区域路由注册的需求就出来了. 默认的 在MVC项目上右键添加区域之后,在文件夹下会自动添加一个FolderName ...

  6. Spark编程指南

    1.在maven里面添加引用,spark和hdfs的客户端的. groupId = org.apache.spark artifactId = spark-core_2.9.3 version = 0 ...

  7. git 服务器新建仓库 远程仓库

    Git 服务器搭建 上一章节中我们远程仓库使用了 Github,Github 公开的项目是免费的,但是如果你不想让其他人看到你的项目就需要收费. 这时我们就需要自己搭建一台Git服务器作为私有仓库使用 ...

  8. Unicode编码:保存中文cookie

    中文和英文字符不同,中文属于Unicod字符,在内存中站4个字符,而英文属于ASCII字符,内存中只占2个字符.Cookie中使用Unicode字符时需要对Unicode字符进行编码,否则会乱码.编码 ...

  9. Java设计模式(17)解释器模式(Interpreter模式)

    Interpreter定义:定义语言的文法,并且建立一个解释器来解释该语言中的句子. Interpreter似乎使用面不是很广,它描述了一个语言解释器是如何构成的,在实际应用中,我们可能很少去构造一个 ...

  10. java不确定参数个数方法例子

    package test; public class myTest { // 根据输入的参数动态生成数组 public static int max(int... param) { int max = ...