是否可以将背景图像置于div中？我几乎尝试过所有事情 - 但没有成功:
<div id="doit">
Lorem Ipsum ...
</div>
//CSS
#doit { background-image: url(images/pic.png); background-repeat: none; text-align: center; }
这可能吗？
我需要一种方法来居中当前窗口.因此,例如,如果用户按下按钮,我希望窗口在屏幕上居中.我知道你可以使用startposition属性,但除了应用程序第一次启动时,我无法找到使用它的方法.那么我如何将表格置于屏幕中心？
有没有办法垂直和水平地居中DIV,但重要的是,当窗口小于内容时,内容不会被切割 .div必须具有背景颜色和宽度和高度.
我总是将div与绝对定位和负边距居中,就像在提供的示例中一样.但它存在的问题是它会削减内容.有没有一种方法可以在没有这个问题的情况下使div .content居中？
我在这里有一个例子:http://jsbin.com/iquviq/1/edit
CSS:
body { margin: 0px; }
.background {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
background-color: yellow;
}
/*
is there a better way than the absolute positioning and negative margin to center the div .content: div with background color a width and a hight?:
*/
.content {
width: 200px;
height: 600px;
background-color: blue;
position:absolute;
top:50%;
left:50%;
margin-left:-100px;/* half width*/
margin-top:-300px;/* half height*/
}
HTML:
<div class="background">
<div …我正试图position:fixed在我的页面上找到一个居中对齐的div .
我总是能够使用这个"hack"来完成定位的div
left: 50%; width: 400px; margin-left:-200px
... margin-left的值是div宽度的一半.
这似乎不适用于固定位置div,而只是将它们的最左边角放置在50%并忽略margin-left声明.
有关如何解决此问题的任何想法,以便我可以居中对齐固定定位元素？
如果你能告诉我一个更好的方法来对齐绝对定位的元素而不是我上面概述的方式,我会投入奖金M&M.
在CSS中,overflow:hidden在父容器上设置,以允许它随浮动子项的高度扩展.
但与margin: auto... 结合使用时还有另一个有趣的功能
如果PREVIOUS兄弟是一个浮动元素,它实际上会与它并列.也就是说,如果兄弟姐妹float:left那么容器float:none overflow:hidden会出现在兄弟姐妹的右边,没有换行 - 就好像它正在漂浮在正常流程中一样.如果之前的兄弟姐妹是float:right容器将出现在兄弟姐妹的左边.调整此容器的大小将准确显示它位于浮动元素之间的中心.如果你有两个以前的兄弟姐妹,一个说float:left对方float:right,容器将出现在中心插图中的两项.
所以这就是问题 ......
如何在不屏蔽孩子的情况下保持这种类型的布局？
谷歌搜索遍布网络给了我如何clear:both和扩展容器的方法...但我找不到任何替代解决方案来维持左/右前一个孩子居中.如果您制作容器,overflow:visible则容器突然忽略浮动元素的布局流程,并且在浮动元素的顶部显示为分层.
所以问题:
我必须有容器overflow:hidden来保存布局......
我该怎样才能让孩子们不被蒙面？我需要让孩子相对于容器外的父母绝对定位.
要么
我如何overflow:visible才能绝对将一个孩子相对于容器外的父母定位... YET保留兄弟浮动状布局流？
我一直在寻找解决这个问题的一天,但没有任何帮助,甚至这里的答案.文档也没有解释任何内容.
我只是想在另一个物体的方向上进行旋转.问题是位图不是围绕固定点旋转,而是围绕位图(0,0)旋转.
这是我遇到麻烦的代码:
Matrix mtx = new Matrix();
mtx.reset();
mtx.preTranslate(-centerX, -centerY);
mtx.setRotate((float)direction, -centerX, -centerY);
mtx.postTranslate(pivotX, pivotY);
Bitmap rotatedBMP = Bitmap.createBitmap(bitmap, 0, 0, spriteWidth, spriteHeight, mtx, true);
this.bitmap = rotatedBMP;
奇怪的是,如何更改pre/ postTranslate()和float参数中的值并不重要setRotation().有人可以帮助并推动我朝着正确的方向前进吗？:)
我想制作列表行布局.此布局最左侧是图像视图,图像视图旁边是文本视图,最右侧是图像视图.我希望他们都是中心垂直的.
<RelativeLayout
android:layout_width="fill_parent" android:layout_height="100dp"
android:gravity="center_vertical"
>
<ImageView
android:id="@+id/icon"
android:layout_width="50dp" android:layout_height="50dp"
android:layout_gravity="center_vertical" />
<TextView
android:id="@+id/func_text" android:layout_toRightOf="@id/icon"
android:layout_width="wrap_content" android:layout_height="100dp"
android:layout_gravity="center_vertical" />
<ImageView
android:layout_width="50dp" android:layout_height="50dp"
android:layout_alignParentRight="true"
android:layout_gravity="center_vertical"
android:src="@drawable/arrow" />
</RelativeLayout>
我也尝试添加android:layout_centerVertical="true"到textview,但结果是textview对齐底部与两个imageview.我在android 4.2模拟器中试过这个.有人可以帮我这个吗？
我有一个div将有这个CSS:
#some_kind_of_popup
{
position: fixed;
top: 100px;
min-height: 300px;
width: 90%;
max-width: 900px;
}
现在,我怎样才能使这个div居中？我可以使用margin-left: -450px; left: 50%;但这仅在屏幕> 900像素时才有效.之后(当窗口<900像素时),它将不再居中.
我当然可以用某种js来做这件事,但是用CSS做"更正确"吗？
通常的CSS中心问题,只是不适合我,问题是我不知道完成宽度px
我有一个div为整个导航,然后内部的每个按钮,当有多个按钮时,它们不再中心.:(
CSS
.nav{
margin-top:167px;
width:1024px;
height:34px;
}
.nav_button{
height:34px;
margin:0 auto;
margin-right:10px;
float:left;
}
HTML
<div class="nav">
<div class="nav_button">
<div class="b_left"></div>
<div class="b_middle">Home</div>
<div class="b_right"></div>
</div>
<div class="nav_button">
<div class="b_left"></div>
<div class="b_middle">Contact Us</div>
<div class="b_right"></div>
</div>
</div>
任何帮助将不胜感激.谢谢
结果
如果宽度未知,我确实找到了一个按钮中心的方式,不是很开心但不重要,它的工作原理:D
最好的方法是把它放在一张桌子里
<table class="nav" align="center">
<tr>
<td>
<div class="nav_button">
<div class="b_left"></div>
<div class="b_middle">Home</div>
<div class="b_right"></div>
</div>
<div class="nav_button">
<div class="b_left"></div>
<div class="b_middle">Contact Us</div>
<div class="b_right"></div>
</div>
</td>
</tr>
</table>
我希望整个块在其父级中居中,但我希望块的内容保持对齐.
示例效果最佳
在本页面 :
ascii艺术应该居中(如它所示),但它应该排成一行,看起来像"YAML".
或这个 :
错误消息应该像在控制台中一样排列.