在jsFiddle上查看我的代码：
HTML代码：
<div>
<img src="http://www.google.com.hk/intl/zh-CN/images/logo_cn.png" width="276" height="110" alt="Google China">
</div>
CSS代码：
div {
height: 118px;
line-height: 118px;
background: red;
}
img {
vertic
浏览 2提问于2012-02-16得票数 2
回答已采纳
请看一下上面的网站。有没有可能让图片块在其容器内始终垂直居中？
换句话说，让带有row-fluid类的div在带有特色项目的div中垂直居中。
浏览 0提问于2013-07-31得票数 0
1回答
我知道有很多关于在div中垂直和水平居中图片的帖子。那不是我的问题。我做到了。
我正在为我的摄影师朋友建立一个文件夹网站，使用(一个自定义的Wordpress主题)。你可以在这里看到:他网站的一些页面只有一张图片，这种情况下，我在 div中垂直和水平居中图片都没有问题(使用.imgcontent :表格单元格，垂直-对齐:中间和文本-对齐:居中的组合)你可以在这里看到成功的例子： (全高，水平对齐) (全宽，垂直对齐)
然而，其他一些页面在jQuery幻灯片中“包装”了几张图片。在这些页面上，我似乎无法使用div居中显示图像。它们与左上角对齐。你可以在这里看到一个例子： (在div的左上角对
浏览 2提问于2012-01-21得票数 0
images div中的图像在Chrome、Firefox中似乎垂直对齐并正确居中，而在Safari中则不然。在Safari中，图片被推入到images div的下方/出，并显示在div下面，如下面所示，流到description div中：
下面是幻灯片的一部分，显示在中间对齐的第一张图像。JS不会工作，因为我在数组中引用了图像，但是幻灯片对我有效，我只关心图像垂直对齐。它们在jsfiddle、Chrome和Firefox中正确地对齐，只是在Safari中不是这样：
浏览 1提问于2015-06-14得票数 0
回答已采纳
我正在尝试使用ImageMagick将图片中的文本垂直居中。
例如，我想要一个200像素高的图像，上面有单词"TEST“，在图像中垂直居中。
我不想指定图像的宽度。我想让ImageMagick根据文本的宽度计算图像的宽度。
-extent参数需要宽度和高度，所以我不能使用它。
我在Cygwin上使用ImageMagick 6.4.0 01/19/10 Q16。这似乎是Cygwin的最新版本。
谢谢!
浏览 2提问于2011-09-02得票数 1
回答已采纳
1回答
UIToolbar的图标通常垂直居中。我想让他们的图标部分地在酒吧外面。请看图片：
是否可以控制按钮的Y位置，从而覆盖UIToolbar的默认位置？
谢谢。
浏览 0提问于2013-04-24得票数 0
回答已采纳
3回答
在div中裁剪居中图像
、、、、
我有一个包含图像(img)元素的div，该元素在其中扩展为100%的宽度。我想指定div的最大高度，并隐藏超过此高度的图像部分。但我也想让这张图片在div中垂直居中，只显示它的中心部分。
例如，如果浏览器宽度为1200px，图像纵横比为4:3，则图像应显示(1200x900)px。但是如果我们只想裁剪高度到300px并垂直居中，图像应该定位在div内部的-300px (并且div应该隐藏图像高度的0-300和600-900 )。类似的想法也可以用在其他的widhts上。
我很确定用javascript可以很容易地做到这一点，但我想知道是否有一种方法可以用CSS来做到这一点。提前感谢！
浏览 2提问于2013-12-07得票数 2
我想在div中水平垂直居中一张图片(根据屏幕大小改变尺寸)。该div的位置是绝对的，高度为100%。在该div下，将放置另一个div。
我做了一个
<body>
<div id="wrapper">
<div id="div1">
<div id="center">
<img src="http://www.vilna.nl/wp-content/uploads/2013/10/test.jpg">
浏览 0提问于2013-12-15得票数 2
我正在使用以下代码在我的iOS 7应用程序中使用自定义图像作为后部指示器：
UIImage *temp = [[UIImage imageNamed:@"back-black-on-black-normal-2"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
[[UINavigationBar appearance] setBackIndicatorImage:temp];
[[UINavigationBar appearance] setBackIndicatorTransitionMaskImage
浏览 3提问于2014-02-11得票数 15
3回答
我知道在CSS中垂直居中一开始是一件痛苦的事情，但我只是让它变得更复杂了一点。在我的页面上，我有：
<ul id="complete">
</ul>
<form id="new_item_form">
<input type="text" id="add_item" placeholder="Type some tasks here"/>
</form>
<ul id="incomplete">
</ul>
浏览 0提问于2012-10-12得票数 1
回答已采纳
1回答
我有一个flexbox里面的一排图像，内容居中对齐，项目居中对齐；即内容应该垂直和水平居中。 所有的图片看起来都很棒，直到我去把这些图片包在标签里，让它们可以点击。这样做会改变样式，将图像提升几个像素，这意味着它不再垂直居中。 在下面的图片中，我在图片后面放置了一个彩色div，以使它们更容易查看： This is how it looks with all the images wrapped in links This is how it looks with 2 images (UK and France) "unwrapped" from links 正如你所看到的，英
浏览 22提问于2020-03-28得票数 0
回答已采纳
3回答
我在我的react原生应用程序中使用了一个多行TextInput，并在此问题上坚持了一段时间。我无法使IOS设备上的文本垂直对齐。 使用textAlign='center‘将文本垂直居中放置在IOS上...但它变成了一个展开的、永不结束的行。 添加multiline={true}会取消IOS中垂直对齐的文本，并将其放在输入的顶部。 <TextInput
style={{
width: wp('80%'),
height: hp('25%'),
borderWidth: 1,
浏览 35提问于2019-01-24得票数 11
1回答
在全屏容器中居中img响应
、、、、
我正在尝试创建一个全屏滚动页面，您可以在其中从一个容器滚动到另一个容器。容器div (块“class=”)有一个以图像和文本为内容的内容div(class=“块内容”)。 我的目标是让内容在全屏div中垂直和水平居中。 我的问题:图片比父div更大，或者图片链接比图片本身更大。我也不能让它垂直居中。 HTML <div class="block">
<div class="blockcontent">
<div class="imgcontainer">
<
浏览 15提问于2021-05-04得票数 0
我正在使用React Native的Image标签来显示具有可变宽度和高度的图像。我已经将图像设置为100x50，并设置了resizeMode = contain，这几乎可以完美地工作，但是如果调整图像的大小，它会完全垂直和水平居中。这种行为可以改变吗？样机屏幕截图：
红色方框表示图像元素设置为100x50。膝上型pic表示可变宽度/高度图片。您将注意到，该行为将所有内容垂直或水平居中。
在第二个例子中，我希望占据100%高度和大约一半宽度的图片被推到左对齐。这个是可能的吗？
谢谢!
浏览 5提问于2016-03-16得票数 16
回答已采纳
这是我想使用www.dealflurry.com的网址: css。我想不出如何让标题文本"Deal Flurry“在它周围的两张图片之间垂直居中。文本停留在图像的底部，而不是中间。我试着把文本和图片放在div中，但我做的方法不起作用。如果有任何帮助，我将不胜感激！
浏览 2提问于2013-03-27得票数 0
回答已采纳
我有一个JPanel，它的GridLayout由1行2列组成。
在第一列中，我有一个由JPanel和Jtree组成的Jpanel。在第二列中，我有一个由JTable组成的JScrollPane。
如何将JscrollPAne居中对齐以显示垂直居中对齐？目前，它显示在顶部，而不是中心。
这是一张图片：
浏览 0提问于2012-01-04得票数 0
回答已采纳
6回答
标题说明了这一点，我有一张图片，上面有一个文本。我想让它始终居中，无论是水平还是垂直。现在我正在用
headerText: {
position: absolute;
top: 40%;
left: 5%;
}
但它似乎不适用于不同的分辨率。那么，有没有其他方法来实现这种布局呢？
网站的 (黄色标题是我要居中的文本)
浏览 0提问于2013-03-18得票数 0
回答已采纳
这是显示问题的图片。看看右下角。
有人知道怎么摆脱它吗？
将LayoutStyle设置为VerticalStackWithOverflow可以解决这个问题，但也会使项目水平居中，这是我不想要的。
我只想要一个像在图片中那样的垂直堆栈，但右下角没有黑线。
浏览 1提问于2011-12-16得票数 15
回答已采纳
我正在使用fabric.js库。我想垂直对齐文本到文本框区域的中心。请看图片。
在图像中，默认的光标是对齐到顶部，但我希望它居中。是否有像textalign这样的valign形式的文本属性
尝试了originY，但没有成功。
浏览 14提问于2018-03-05得票数 1
1回答
我在一个4x3的图片画廊工作，图片来自一个数据库。所有的图片都有不同的尺寸。使用Bootstrap和CodeIgniter，我为每个图像创建行和列。现在我希望宽图片适合行的高度，水平居中，隐藏水平溢出。我也希望高大的图片适合列的宽度，垂直居中，隐藏垂直溢出。就像Facebook一样。 边距-左:自动；边距-右:自动；不要居中图像。 我的索引页面： <h1><?=$title?></h1>
<?php $i = 1; foreach ($photos as $photo) {
if ( $i % 3 == 1 ) { ?>
浏览 62提问于2019-06-26得票数 2
回答已采纳
1回答
我逐一尝试了这些方法:在资源编辑器中将BgAlign属性设置为CENTER，然后使用myLabel.getStyle().setBackgroundAlignment(Style.BACKGROUND_IMAGE_ALIGN_CENTER);，但标签的文本不会垂直居中。
那么如何让Label的文本垂直居中呢？
下图显示了标签文本的实际对齐方式：
浏览 1提问于2011-09-24得票数 0
回答已采纳
我正试图在一个简单的网页上的一个简单的其他元素很少的3个图像的图像画廊中心。所有内容都应该在页面上居中。但图片库是垂直显示的，而不是排成一行。它向左对齐，而不是居中。 我使用了我在这个网站上找到的图片库代码。我还尝试了其他一些现在在我的代码中注释掉的东西。 您可以通过以下url查看页面和代码：http://www.sherryhutson.com/splash4.html 我希望这3个图像显示在一行。我希望该行在网页上居中(以匹配页面上的其他元素。
浏览 90提问于2019-06-07得票数 0
2回答
我有2个图片在我的主页上，这是垂直居中。
#pgc-10-1-1.panel-grid-cell {
display: inline-block;
float: none !important;
vertical-align: middle;
}
#pgc-10-3-0.panel-grid-cell {
display: inline-block;
float: none !important;
vertical-align: middle;
}
但是，我希望它们在水平和垂直方向上都居中。
当我不使用float: none !important;时，图像水平居中，而不是垂直居中。当我使用f
浏览 3提问于2016-03-11得票数 0
3回答
我只是个初学者。我设法将我的div水平居中，其中包含3个段落，如下所示：
div p {
text-align: right;
margin-right: 50%;
color: white;
}
如何让它们垂直对齐，文本右对齐？相关图片。
<div class="imperio">
<p>Império<br>
dos<br>
Sabores</p>
</div>
浏览 3提问于2014-03-04得票数 0
有没有一种“顶部对齐”UILabel的方法，那就是让文本粘贴到标签视图的顶部？而不是垂直居中对齐，或在视图的中心浮动，这是默认的吗？
这是三个标签的图像，左对齐、右对齐和居中对齐，以及一个居中和顶部对齐的UITextView。无论视图的垂直大小如何，textView的文本都会显示在顶部。我可以对标签做同样的事情吗？
浏览 1提问于2012-08-08得票数 30
回答已采纳
这是我的代码： 何时 在使用时，我得到了所有flex项垂直对齐到顶部的视图，这是我的目标，但它们不是水平对齐到中心，右侧有一个间隙(第一张图片中的问号显示在那里)。 当我删除 从代码开始，成为父元素，项目位于中心，水平和垂直方向(第二张图片)。 同样，我需要它们与顶部v对齐并水平居中。如何做到这一点？ ? ?
浏览 78提问于2017-10-28得票数 1
回答已采纳
我被一个我正在工作的网站的css布局卡住了。这是一个报告工具，将在宽屏显示器和上网本上使用。网站已经完成了，除了一个样式表，它可以很好地从(非常)宽屏幕格式降级为窄(上网本)格式。
下面是它在宽屏幕上的显示方式：
对于窄屏幕：
我希望它在狭窄的图片中降级为右边的，但我认为左边的会更可行。
我知道我可以根据屏幕大小进行条件css加载，但我希望它只是一个样式表。问题的核心是，我希望右侧(图形)内容是垂直的，当页面较宽时居中，但当没有空间显示时，居中并在表格的上方/下方水平。垂直滚动是可以的。带有红色边的桌子是动态高度的，这也是一个问题。
我有一个布局，使正确的图形数据居中描述，但不知道如何迫使它从
浏览 0提问于2011-06-28得票数 3
回答已采纳
3回答
我基本上是在尝试创建一个两列的div，其中一个是liquid <h1>，另一个是跨越整个<h1>高度的div，但我希望垂直对齐居中。我基本上是想把一个图片放在页面标题的左边：
<div class="outer">
<div><img src="pound.png" /></div>
<h1>This is text that is really long. This is text that is really long. This is text that is
浏览 1提问于2012-04-09得票数 0
回答已采纳
2回答
我在对齐数据网格的标题文本时遇到了一些问题。我对标题文本使用嵌入字体，并且在应用css时，标题文本的行为就像我将文本垂直对齐设置为顶部一样。我正在尝试将文本垂直居中，但还没有找到一种方法。
一张让你有更好想法的图片：
有什么建议吗？
致敬，BS_C3
浏览 3提问于2010-03-25得票数 1
回答已采纳
我有几个项目想要在一行中居中，还有几个项目我想放在居中的项目的右边，但不是在最右边。这是一张图片：
所以中间3的容器实际上应该居中。还需要它们都垂直居中。想法？
浏览 8提问于2018-02-19得票数 1
回答已采纳
2回答
我正在使用jquery masonry来显示图像。在这些图片中，我有一个脚本，可以让我滚动和淡入标题。然而，我希望它们在盒子中完美地居中。对于Jquery masonry，没有绝对的高度值。是否可以像水平放置一样垂直放置事物(类似于:margin right: auto；margin left:auto；clear: both;)
现在的位置是从顶部开始设置的50%，但是在较小的元素上，标题似乎偏离了中心。
以下是我的进度的链接：
谢谢你的帮助！
杰夫
浏览 0提问于2011-09-01得票数 1
3回答
尝试设置高114px、宽100% (页面宽度)的外部DIV。在里面，我需要三个DIVs，左，中，右。这些内部3个div的高度各不相同。我希望所有三个内部DIVs从上到下居中(垂直对齐)。
我已经接近了左右浮动或左:0和右:0，但停留在垂直居中的部分。左边和右边的DIVs只包含图像的中心文本。很难在jsfiddle上显示图片，所以我不能提供太多的例子，对不起。
我已经找到了顶部和底部对齐的例子，但没有以运气为中心。
谢谢!
编辑：
TyBlitz你给我指明了正确的方向谢谢!但是，在您的容器div height上-内部div高度，您需要除以2。对于您的示例：
114-50=64 then divi
浏览 2提问于2013-09-10得票数 1
我想让div始终水平和垂直居中。
我可以减小/增加窗口的宽度，div将始终保持在窗口的中心
.cent
{
height:50px;
width:50px;
background-color:black;
margin:auto;
}
这是我目前所拥有的。但是我也想让div保持垂直居中，所以如果我减少/增加窗口的高度，div会以停留在窗口中间来响应。
关于这个例子，我想让黑盒在调整窗口大小时保持垂直居中，就像它总是水平居中一样。
浏览 1提问于2013-07-08得票数 17
回答已采纳
1回答
我想垂直对齐按钮。这是我的代码 ...i想让中间的按钮垂直居中，还有按钮里面的文本垂直居中，..anyone能帮我吗？
浏览 1提问于2012-08-15得票数 0
回答已采纳
如何在UItableViewCell中将UIviews垂直居中？
我想让UIButton在UITableViewCell中垂直居中
浏览 0提问于2014-08-06得票数 0
我有一个div，里面有几张图片，我想把它垂直居中。我可以给出一个特定的宽度和高度来做div。没问题。如果有必要的话，我也会接受js。我只是在想，从那些迷宫的例子中，我能有一个简单的例子。
div as的宽度为600，高度为500。
提前感谢，MEM
浏览 3提问于2010-10-27得票数 0
回答已采纳
我试图在屏幕上显示一个以水平和垂直为中心的React旋转组件，在搜索和读取不同的类似答案之后，例如这个，我可以将它水平地对中，目前我的代码如下：
import ClipLoader from "react-spinners/BounceLoader";
function Spinner() {
return (
<div
style={{
display: "flex",
alignItems: "center",
justifyContent: "cente
浏览 23提问于2022-11-09得票数 -1
回答已采纳
1回答
我有一个非常基本的slick.js图像滑块。我设法使包装器中的图像水平居中，但不能垂直居中。它适用于桌面视图，但当我在移动视图上尝试它时，站立的图片完美地保持在中间，但躺着的图片留在页面的顶部。我想让躺着的照片垂直地放到中间。 我的代码： index.html： <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=
浏览 61提问于2020-07-17得票数 0
回答已采纳
我正在看这个页面- https://getbootstrap.com/docs/5.0/components/modal/ 此示例显示了垂直居中模式。 <!-- Vertically centered modal -->
<div class="modal-dialog modal-dialog-centered">
...
</div> 默认情况下，它也是水平居中的。 但是模式在屏幕中居中，我想让它在<div>元素中居中。 我该怎么做呢？ 我目前使用的是bootstrap版本5。
浏览 25提问于2021-08-11得票数 0
2回答
我正在尝试合并一个脚本(我相信是由"dystroy“编写的)，它将图像垂直居中放置在div中，并隐藏溢出。它工作得很好，但我的许多图像都是在鼠标悬停时动态加载的。
我需要找到一种在加载图像时调用脚本的方法。已经两天了，因为JS/JQuery不是我的母语，所以我在这里找到了自我。
有没有人能给我提个建议，让下面的代码在图片加载时启动？非常感谢！
<script type='text/javascript'>//<
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
