关于css中overflow的一些理解
在做移动端开发的时候,遇到过这么个问题:要把图片进行放大,但有时候图片比较长,一个手机的版面看不了,于是需要用到overflow的属性,刚开始用了overflow-y:scroll,
于是问题来了,如果图片没有过长,也会出现滚动条,这样就没有达到预期的效果,于是换了一个属性overflow-y:auto;这样的话,当图片过长的时候才会出现滚动条,这样就可以达到预期的效果;
下面是一个总结:
参数是scroll时候,不管需不需要滚动条,都必会出现滚动条。
参数是auto时候,子元素内容大于父元素时出现滚动条。
参数是visible时候,溢出的内容出现在父元素之外。
参数是hidden时候,溢出隐藏,此属性在浮动属性中是屡试不爽呀。
关于css中overflow的一些理解的更多相关文章
- CSS中overflow:scroll怎么设置只上下滚动而不左右滚动
CSS中"overflow:scroll"默认是左右,上下都滚动.怎么设置只上下滚动而不左右滚动,下面有个不错的解决方法 CSS中"overflow:scroll&quo ...
- css中overflow:hidden的属性 可能会导致js下拉菜单无法显示
css中overflow:hidden属性导致ExtJS中无法显示下拉滚动条 overflow属性: visible 默认.内容不会被修剪,会呈现在元素之外. hidden 内容会被修剪,但是浏览器不 ...
- 转:css中overflow:hidden 不起作用了吗?
css中overflow:hidden 不起作用了吗? 有同学遇到这样的问题,现象是给元素设置了overflow:hidden,但超出容器的部分并没有被隐藏,难道是设置的hidden失效了吗?其实看似 ...
- CSS中盒模型的理解
今天突然看到一篇关于CSS中盒模型的文章,忽然觉得自己竟然遗忘了很多小的地方,所以写一篇文章来记忆一下 (摘抄于千与千寻写的CSS盒子模型理解,并在自己基础上添加了一些东西,希望更完善,对大家有帮助) ...
- CSS中overflow:hidden
CSS中,overfllow:hidden的作用是隐藏溢出 比如:<div style="width:300px;overflow:hidden" id=1><d ...
- CSS中box-sizing属性的理解与部分用法
今天看了一些关于box-sizing的一些资料,在这里整理一下,希望也能对大家有所帮助. box-sizing是CSS的一个属性,很好的解决了盒模型的相关问题.CSS中的盒模型(Box model)分 ...
- 对css中clear元素的理解
clear:left;表示左侧不能有浮动元素. clear:right;表示右侧不能有浮动元素. clear:both;表示左右两侧都不能有浮动元素. 但在使用时,还得考虑css优先级问题.相同类型选 ...
- 我对CSS中的BFC的理解
1.什么是BFC 其实在老师让我们写这篇叫BFC的时候,我跟本不知道有什么BFC的东西. 后来,我找了一些资料,知道了,BFC是Block Formatting Context (块级格式化上下 ...
- 转: CSS中overflow的用法
Overflow可以实现隐藏超出对象内容,同时也有显示与隐藏滚动条的作用,overflow属性有四个值:visible (默认), hidden, scroll, 和auto.同样有两个overflo ...
随机推荐
- Javascript Promise 学习(上)
Promise 就是处理异步的一个规范方法 a();b();alert("a");如果a() 里面有一个ajax 或者settimeout 那么alert("a" ...
- 用MarkDown来排版写作
Latex排版系统太复杂,MD很好用,微软开源了一套Madoko的开源在线MD编辑器,它提供了一台MD扩展,可以生成PDF(中间先生成Tex,再生成的PDF),幻灯片还有html.非常方便.写作,写p ...
- Visual Studio新建的源文件的默认编码
原来VS新建的源文件默认的编码是根据系统locale选择的.我的是国标2312.我草.可坑死我了.一直不知道. 当时主要是需要用doxygen生成html文档,它默认的输入文件的格式是UTF-8,是不 ...
- 【转】锋狂百科:手机也能接外设 OTG技术详解
原文网址:http://www.gfan.com/review/2014030346245.html 说到USB数据接口,相信大家并不陌生,在日常使用各类数码产品时我们几乎都会用到它.例如最常用的U盘 ...
- AngularJs中文社区学习资料
AngularJs中文社区学习资料,供学习: http://angularjs.cn/tag/AngularJS
- Codeforce 221 div1
A 只要打个表就能发现,1,6,8,9的所有排列就可以产生0~6的余数了... 所以...走不下去的时候一定要打表... #define rep(i,n) for(int i=0 ; i<(n) ...
- PHP各版本之间差异
PHP5.3 __toString 魔术方法不再接受参数. 魔术方法 __get, __set, __isset, __unset, and __call 应该总是公共的(public)且不能是静态的 ...
- 你需要知道的九大排序算法【Python实现】之基数排序
八.基数排序 基本思想:基数排序(radix sort)属于"分配式排序"(distribution sort),又称"桶子法"(bucket sort)或bi ...
- SpringMVC+highstock实现曲线报表
最近项目要做曲线报表,之前用的是生成图片然后传到前端,感觉不是很好,在网上找到资料说highstock就可以而且还可以做类似股票的那种实时的曲线,研究的一段时间把项目问题解决了做个总结: 首先把hig ...
- 用GDB调试多进程程序
在子进程中sleep.然后attach上去. gdb --pid=123456 ps出子进程的id,gdb attach 进程号. http://www.ibm.com/developerworks/ ...