CSS中元素在某一行上 居中/居左/居右

我们在做网页的时候经常会遇到这样的需求,要求某张图片在某一行上 居中/居左/居右。
传统的做法是用table来分配,但是这样做极其笨!!

如果我们采用CSS,
一般有2种做法:
1)设置这一行的div的style为:text-align:left; / text-align:center; / text-align:right;

2) 设置该元素的style为:float:left; / float:right;

注意:元素浮动没有向中间,只有向左或向右。

时间: 2024-10-25 07:01:46

CSS中元素在某一行上 居中/居左/居右的相关文章

Android中解决页签手指按下从左到右滑动的bug_Android

有一种方法可以阻止父层的View截获touch事件,就是调用 getParent().requestDisallowInterceptTouchEvent(true);方法. 一旦底层View收到touch的 action后调用这个方法那么父层View就不会再调用onInterceptTouchEvent了,也无法截获以后的action 在ViewPagerIndicator项目中找到TabPageIndicator该类,添加如下代码 @Override public boolean dispa

CSS中div高度内容垂直方向居中方法总结

让div中的内容垂直居中,无非有以下几种方法,等我一一列举:  一.行高(line-height)法  如果要垂直居中的只有一行或几个文字,那它的制作最为简单,只要让文字的行高和容器的高度相同即可,比如:   代码如下 复制代码 p { height:30px; line-height:30px; width:100px; overflow:hidden; }   这段代码可以达到让文字在段落中垂直居中的效果.  二.内边距(padding)法  另一种方法和行高法很相似,它同样适合一行或几行文

jQuery弹出窗口完整代码(居中,居左,居右)_jquery

-居中窗口 www.jb51.net -居左窗口 www.jb51.net -居右窗口 www.jb51.net

css中元素水平垂直居中4种方法介绍

  table-cell轻松设置文本图片水平垂直居中 让一个元素垂直居中的思路:把这个元素的容器设置为table-cell,也就是具有表格单元格的特性,再使用vertical-align(这个属性对block元素不起作用,但对table-cell元素是有效的)设置元素垂直居中,即可达到我们想要的效果. IE7及以下版本不支持此方法,IE8及以上版本及大部分的主流浏览器都很好的支持. HTML代码  代码如下   <div class="img">     <img s

总结CSS中火狐浏览器与IE浏览器的兼容代码

总结CSS中火狐浏览器与IE浏览器的兼容代码,兼容你兼容主要是语法规范问题,你写CSS写规范了,就都兼容了,其他的就是一些浏览器的BUG了,发一些技巧给你看看,或许有用. CSS技巧 1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行 2.margin加倍的问题 设置为float的div在ie下设置的margin会加倍.这是一个ie6都存在的bug.解决

css中常用的ff,ie6,ie7样式兼容问题收集

现在大部分都是用!important来hack,对于ie6和firefox测试可以正常显示,但是ie7对!important可以正确解释,会导致 页面没按要求显示!找到一个针对IE7不错的hack方式就是使用"*+html",现在用IE7浏览一下,应该没有问题了现在写一个CSS可以这样:  代码如下 复制代码 #1 { color: #333; } /* Moz */ * html #1 { color: #666; } /* IE6 */ *+html #1 { color: #99

关于css中不同浏览器兼容详解(1/6)

由于浏览器的开发商越来越多,关于css教程兼容也是各位设计师,站长们讨论的热门话题了,下面我们总结了一些学用中的css兼容问题的. 1.div的垂直居中问题 vertical-align:middle;将行距增加到和整个div一样高line-height:200px;然后插入文字,就垂直居中了.缺点是控制内容不要换行 2 margin加倍的问题 设置为float的div在ie下设置的matgin会加倍.这是ie6都存在的bug.解决方案是在这个div里面加上display:inline;例如 <

div布局-请问怎么让div中的div在垂直方向上居中呢?

问题描述 请问怎么让div中的div在垂直方向上居中呢? 比如:下面这段代码,如何让里面的div在垂直方向上面居中呢(不好意思,实在是没有悬赏币了) .out{ width:500px; height:500px; background:blue;}.inn{ width:200px; height:200px; background:red;} 解决方案 你的inn怎么比out还大..搞反了吧..通过margin来定位.absolute定位最好,不需要考虑父容器,只需要依据自身的宽和高度来调整

CSS中的元素定位方法详解

  1.盒模型 盒模型,就是 浏览器为页面中的每个 HTML 元素生成的矩形盒子. 这些盒子们都要按照 可见版式模型(visual formatting model)在页面上排布.可见的页面版式主要由三个属性控制: position 属性. display 属性和 float 属性.其中,position 属性控制页面上元素间的位置关系, display 属性控制元素是堆叠.并排,还是根本不在页面上出现, float 属性提供控制的方式,以便把元素组成成多栏布局. 盒子属性分三组: 边框(bor