链接标记水平居中，iframes显示在
页面中央，如何实现？
要实现链接标记水平居中，可以使用CSS的text-align属性来实现。将链接标记包裹在一个容器元素内，然后给容器元素设置text-align:center;即可实现水平居中。
示例代码如下：
<div style="text-align:center;">
<a href="https://example.com">链接标记</a>
</div>对于iframes的居中显示，可以使用CSS的flex布局来实现。将iframe包裹在一个容器元素内，然后给容器元素设置display:flex;和justify-content:center;即可实现水平居中。
示例代码如下：
<div style="display:flex; justify-content:center;">
<iframe src="https://example.com"></iframe>
</div>这样就可以实现链接标记和iframes的水平居中显示。
相关·内容
2回答
我需要创建一个具有指定功能的DHTML菜单，但是我不知道怎么做。这是我需要的：
所有的项目都水平布局。如果它们比屏幕更宽，菜单的右侧会出现两个小箭头，用于滚动菜单。如下所示：
+--------+--------+-------+---+---+
| Item 1 | Item 2 | Item 3| < | > |
+--------+--------+-------+---+---+
菜单项应该可以在单元格中的任意位置单击。它们应该垂直和水平地延伸到内容。项目中的文本应该在垂直和水平方向上居中。该菜单应在IE7/Opera/FF/Safari中工作。
滚动是最简单的部分--我只
浏览 4提问于2008-12-09得票数 0
回答已采纳
2回答
我在php中有一个iFrame，我想以居中的水平显示它，这是我的代码。如何编辑它，使其在浏览器中显示中心水平。
<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
</head>
<body>
<div>
<iframe src="https://<??>" width="850" target="_parent" height="850" scroll
浏览 2提问于2014-09-15得票数 0
回答已采纳
我正在努力实现以下目标:我在页面的中央有一个垂直和水平的中间div (wrapper)。在该div中，我希望有另外2个div，其中一个将包含徽标，另一个将包含一些文本。徽标图像还必须与其div的中心垂直和水平对齐。目前，我所拥有的是：
下面是我的HTML和CSS的jsfiddle：
我如何才能使logo div居中(仅水平居中，并具有10px的页边距-顶部)，并使logo图像在该div内居中，水平和垂直居中，就像现在一样？
浏览 2提问于2012-10-16得票数 1
回答已采纳
我一直在尝试将一个联系人表单和一个反馈表单居中，为了让它们水平对齐，我使用了float: left；对于这两个表单，我也希望这两个表单都水平居中显示，
每次我让它们一起水平显示时，它们就粘在左边，当我让它们居中时，它们一个在另一个上面，
我正在尝试做上面的两件事
我试过使用
display: block;
margin-left: auto;
margin-right: auto;
width: 500px;
我还使用了float: left；将它们水平放置在彼此的旁边，但我也不能将它们从该选项居中。
text-align: center;
似乎只是将文本居中
浏览 0提问于2015-12-02得票数 0
这是我的代码： 何时 在使用时，我得到了所有flex项垂直对齐到顶部的视图，这是我的目标，但它们不是水平对齐到中心，右侧有一个间隙(第一张图片中的问号显示在那里)。 当我删除 从代码开始，成为父元素，项目位于中心，水平和垂直方向(第二张图片)。 同样，我需要它们与顶部v对齐并水平居中。如何做到这一点？ ? ?
浏览 78提问于2017-10-28得票数 1
回答已采纳
我正在尝试使方框div可点击，但我使用的代码是
display:flex;
align-items: center;
justify-content: center;
要将文本水平地居中，因为当我使用display:block时，如果文本是长的，文本就不会水平地居中。
我这里有一个演示，
当您尝试单击右div时，必须将鼠标指向文本上方。我希望整个右div是可点击的(链接类似于文本)，而不管文本的长度。至于左边的div，您可以在div上的任何位置悬停，因为文本很长，所以可以单击。我认为这取决于文本的宽度，因为当我尝试使用Firebug并在右侧div上的文本上悬停时，高度是100%，但是宽度取决于
浏览 0提问于2014-05-28得票数 1
回答已采纳
我正在使用，所有示例的菜单都从屏幕左侧开始。
有没有办法让这个居中，这样如果我有一个宽的监视器，它就会水平地显示在中心。
浏览 0提问于2012-02-19得票数 1
回答已采纳
我的简单页脚代码使用宽度为100%的表格，其中包含一个居中的td，其中的另一个表格包含链接，这使链接在可用空间中居中。只要有足够的水平空间来放置所有的链接，它就可以正常工作，但如果没有水平空间(即在手机上，portait)，它就不会换行。我如何保持居中，并允许必要的包装？
<footer>
<table style="width:100%">
<tr>
<td align="center">
<nav>
浏览 28提问于2018-02-07得票数 0
回答已采纳
我想让div始终水平和垂直居中。
我可以减小/增加窗口的宽度，div将始终保持在窗口的中心
.cent
{
height:50px;
width:50px;
background-color:black;
margin:auto;
}
这是我目前所拥有的。但是我也想让div保持垂直居中，所以如果我减少/增加窗口的高度，div会以停留在窗口中间来响应。
关于这个例子，我想让黑盒在调整窗口大小时保持垂直居中，就像它总是水平居中一样。
浏览 1提问于2013-07-08得票数 17
回答已采纳
我希望一些跨越整个页面宽度的<section>的内容不超过一个特定的像素宽度(这里: 300px)。如果页面(即部分)比它更宽，则内容应水平居中。 为了实现这一点，我目前使用了一个小辅助<div>，它a)定义了内容的最大宽度，b)使用水平auto边距来水平居中显示内容： section {
background-color: teal;
}
.content {
max-width: 300px;
margin: 0 auto;
} <section>
<div class="content">
T
浏览 62提问于2019-04-21得票数 3
回答已采纳
我试图使一个链接，其中有一个height和一个200px的width。链接的文本应垂直居中和水平居中。
到目前为止，这是我的CSS：
a:link.Kachel {
width: 200px;
height: 200px;
margin: 0 auto;
display: block;
text-align: center;
background: #383838;
display: -webkit-box;
display: -moz-box;
display: box;
-webkit-box-align: center;
-moz-box-al
浏览 0提问于2013-02-14得票数 44
回答已采纳
3回答
我正在尝试在Javascript中居中按钮，以便它在页面中水平居中。现在，我的按钮在html文件中，所以我不知道如何使用CSS将其居中，因为它在Javascript中。 TLDR:在Javascript中，如果我声明了一个按钮btn，我应该写什么代码来水平居中它？ 我在互联网上到处寻找一种使用Javascript使按钮居中的方法，但都无济于事。我希望你们都能帮助我。 谢谢!
浏览 501提问于2021-06-26得票数 0
回答已采纳
我的目标是让几个图像在一个div中水平居中显示，这个div在包装器中也是水平居中。我可以这样做，但是当我在图像上调用jQuery的“弹跳”效果时，它们会左对齐。
我已经摆弄了很长时间，不能让它们在弹跳时保持中心位置。
在上查看它
我在Win7上使用的是最新的火狐浏览器。
浏览 0提问于2012-07-18得票数 4
回答已采纳
3回答
我有一个页面，它使用引导程序显示内容，并且我已经得到了它的大部分内容，除了我的图像，即使垂直居中，也不是水平居中。
我试着制作它，这样如果有人添加了一个小图像或一个巨大的图像，它总是包含在列/行中，并且响应于那个容器，但我也想确保如果图像比容器小，那么它完全位于容器的中间。
我在这里遗漏了什么，以确保图像是居中对齐的，除非另有规定？
html,
body {
height: 100vh;
width: 100vw;
overflow: hidden;
}
iframe{
height:100% !importan
浏览 1提问于2019-01-11得票数 0
回答已采纳
1回答
如何将整个站点居中显示在屏幕的中央？
水平方向和垂直方向；
这是，看它是水平居中，垂直居中，现在缺少(任何分辨率)
可以在上随意修改源代码。
浏览 0提问于2011-05-12得票数 1
我有一个iframe的代码，它显示了一个google文档：
<div itemprop="description" class="col-xs-12 no-h-padding" id="article_desc" style="margin:0 auto; width:90%; float:none;">
<iframe src="https://docs.google.com/viewer?url=http://example.com/docs/1.pdf&hl=ar&embedd
浏览 6提问于2016-03-22得票数 9
回答已采纳
CSS的新手，请耐心听我说。我试图在HTML/CSS中垂直堆叠不同的项目，但无法让它们以自定义间距垂直堆叠。这是我到目前为止所拥有的。
<p id="loginView">
<input type="text" id="usernameField">
<div></div>
<input type="password" id="passwordField">
<button id=
浏览 0提问于2019-06-10得票数 0
我有一个网上相册。缩略图页面是一个150px x 150px div的网格，缩略图图像设置在其中。
由于缩略图是矩形的，理想的做法是在div中自动居中。
读到这里，我想出了如何使它们水平居中。我还读到，在CSS3起飞之前，自动垂直居中是不可能的。这是真的吗？
我已经得到了水平图像自动居中，这是：
.portrait_t {
width: auto;
height: 150px;
text-align: center;
display: block;
margin: 0 auto 0 auto;
}
但是，垂直居中不起作用：
.landscape_t {
width: 150px;
height
浏览 1提问于2012-06-15得票数 0
回答已采纳
我有一个div容器，在这里我想放一个居中的图像和一个小的描述在右边。规格如下：
图像的底部边缘应为35 of。
图像应该始终在屏幕上完全显示，因此当屏幕显示时它会调整大小。它应该有尽可能大的大小，但不要被裁剪，永远不要使用滚动条。
图像应该相对于容器居中，文本显示在右边的边缘。
文本应该水平地左对齐，中心垂直对齐，并与图像有30 be的距离。
我尝试过在容器中使用table并使用div，但是找不到干净的解决方案。我可以给你看我按要求试过的不工作代码。
浏览 0提问于2013-06-28得票数 2
1回答
假设我的表脚本中有这行代码： <th rowspan="2" colspan="1">The header</th> 结果如下所示：one of the headers of my table 我想要的结果是文本在垂直和水平方向上都居中。 我试过class=的“文本中心”，但它只在水平方向居中。我发现的其他解决方案只有1个rowspan，所以它是不同的，我可以只使用文本中心。我还找到了这个我假设为vertical-align的valign，它有“中间”值，但它也不起作用。 如何获得我想要的结果？
浏览 32提问于2021-11-16得票数 0
我怎么才能水平居中一个有100%宽度的div呢？
#conteudo{
padding-top: 30px;
width: 100%;
background: #fff7db url(../_img/content-border.jpg) repeat-x ;
min-height: 1080px;
padding-bottom: 10px;
}
#principal{
width: 50%;
margin: 0 auto;
}
<div id="conteudo">
<section id="principa
浏览 2提问于2016-06-30得票数 0
21回答
我想使一个position: fixed;弹出框居中的屏幕与动态的宽度和高度。为此，我使用了margin: 5% auto;。如果没有position: fixed;，它可以水平居中，但不能垂直居中。添加position: fixed;后，它甚至不会水平居中。
以下是完整的设置：
.jqbox_innerhtml {
position: fixed;
width: 500px;
height: 200px;
margin: 5% auto;
padding: 10px;
border: 5px solid #ccc;
backgrou
浏览 5提问于2010-01-05得票数 513
回答已采纳
我有一个html页面，有两个div。左div包含所有内容(页面的索引)与超链接。现在我想显示在右div中的内容，即用户有clicked.In右div我已将页面水平分成3个目标，80%的水平div它应该显示内容。我尝试使用锚标签中的parts..10%,80%,10%.In属性，但它没有显示在正确的div.How中来解决这个问题？
浏览 0提问于2013-12-16得票数 0
1回答
divs的中心列
、、
我有一个页面，里面有一堆大小相等的div，我想把它们放在包装器div的可用空间中。
其想法是：-在大屏幕中，div将显示在3列中-在中等尺寸屏幕中，div将显示在2列中-在手机屏幕中，div将显示在1列中。
我还想让包装纸水平居中。
我在试着：
#wrapper {margin:0 auto;}
.column {float:left; max-width:340px; height:540px; margin:20px}
它可以正常工作，但包装器没有居中，这是我试图通过css的第1行实现的。
你知道我该如何做到这一点吗？
编辑：
HTML代码：
<div id="wrapp
浏览 0提问于2016-01-12得票数 0
我有以下情况：
Iframe网页www.notMyWebPage.com包含指向我域的iframe ( iframe的内容是从www.myWebPage.com加载的)
链接案例网页www.notMyWebPage.com包含指向我的域的链接(它指向www.myWebPage.com)
我想知道，如果从SEO的角度，我得到了相同的排名好处(即，‘果汁’)的www.myWebPage.com在Iframe比在链接的情况。
注意，这个问题指的是SEO对www.myWebPage.com的影响，而不是对www.notMyWebPage.com的影响，这是另一个问题关注的主题。
浏览 0提问于2013-06-12得票数 11
回答已采纳
我试图在视图控制器中水平和垂直地对MKMapView进行居中：
每当我试图使用自动布局约束，地图消失时，我运行的应用程序。是否有一种方法以编程方式对其进行居中，使其位于视图控制器的中心而不会消失。
地图中心的图标只是一个按钮，我用它作为标记来显示用户，如果他们点击next按钮，他们将标记地图的哪个部分。
提前感谢您的帮助。
浏览 4提问于2017-12-30得票数 1
回答已采纳
4回答
我想在屏幕中间居中显示一段文字。我想使用bootstrap将文本居中显示在屏幕中间，以节省一些时间。
我这样做了，但块仍然在中间的水平，而不是垂直和水平。
CSS：
.block {
top: 50%;
left: 50%;
}
HTML：
<div class="row">
<div class="col-xs-4">Text</div>
</div>
浏览 5提问于2015-01-23得票数 1
2回答
我有这样的东西：
<p style="text-align:center;background-color:yellow;"><span style="vertical-align:middle;">My text goes here...</span></p>
显然，正如您在这里看到的，我的意图是将跨度居中(水平和垂直)。文本水平居中很好，但是为什么垂直居中不起作用呢？这是怎么回事？
谢谢
浏览 2提问于2012-03-16得票数 3
回答已采纳
所以我想在这里实现的是一个固定宽度的红色框，比如400px，它在页面上水平居中。红色方框的两侧是一个绿色方框和一个可变宽度的淡紫色方框，它们水平填充窗口的其余部分，并拉伸以适合窗口大小。
因此，在较大的显示器上，绿色和淡紫色的盒子将水平拉伸，而页面中间的红色盒子将保持相同的宽度。
这个解决方案需要在IE8和更高版本中工作，虽然我对只在IE9 +中工作的解决方案感兴趣。
浏览 0提问于2014-03-31得票数 0
问题
在符合包含<figure>的高度时，我应该编辑什么使图像水平地居中
缩略图是75便士x75便士。上传的图片可能各不相同，但通常大约为4:3，比如800 pxx600px。
HTML
<figure>
<img src="">
</figure>
沙斯
figure {
background-color: #777;
display: inline-block;
text-align: center;
overflow: hidden;
height: 75px;
wi
浏览 2提问于2017-10-06得票数 0
我的所有内容都有一个容器，它宽1000 my，垂直和水平地居中。上面的div是1600 it，左边框为-300 it，以匹配下面的“完全出血”背景图像。我希望我的徽标与宽显示器上的图像一起显示，但当窗口小于1600 is时，请按下。目前，它溢出了窗口。
注意:我通常会在容器div之外运行报头，但是整件事情都是垂直居中的，这会抛出中心位置，所以我想保持容器作为父文件。
浏览 2提问于2012-08-03得票数 0
回答已采纳
3回答
我正在尝试水平地打印我的列表，但是它不适合内联显示。我还使用了float: left;和position:center，但是它不是水平居中的。
PHP
foreach ($memberinfo as $info)
{
echo "<ul><li><a href='profile.php?user_id=" . $info['user_id'] . "'><img class='group_member_img' src='uploads/" . $info
浏览 2提问于2014-04-20得票数 0
回答已采纳
4回答
有没有办法在不使用float:left的情况下水平显示一行链接？在使用float:left时，将div居中太难了，我永远不能让它工作。
浏览 0提问于2012-02-29得票数 1
回答已采纳
如何使用javascript、css和/或html在表格单元格中的图像上居中显示文本？
我有一个包含图像的HTML表-所有图像的大小都相同-并且我想在每个图像上居中放置一个文本标签。标签中的文本大小可能不同。水平居中并不难，但垂直居中却很难。
附录:我最终不得不使用javascript使用固定大小的div和绝对定位来可靠地将文本居中；我只是无法让它以任何其他方式工作。
浏览 2提问于2008-09-18得票数 1
回答已采纳
1回答
我正在尝试居中gif，这是标记代码：  上面的代码在左边对齐我的gif (见下图)： ? 因此，我尝试像这样将标记放在<p>标记中，但它不起作用： <p align="center">
</p> 我的问题:我想在Github自述文件中水平居中.gif，有什么方法可以做到吗？我想要的示例： ?
浏览 16提问于2020-06-12得票数 0
回答已采纳
我希望是无响应的。它大约有1000px宽。我希望它完全显示在我的智能手机上，这样用户就必须放大才能阅读正常大小的字符。
然而，无论我做什么，当我在智能手机上观看时，我的主要内容的右侧总是有数百个像素。我尝试将width: 1050px设置为包含整个页面的"wrap“元素，结果相同。现在我的body标记被设置为width: 1050px，同样的结果。
我试着不使用viewport标签。然后我试着用<meta name="viewport" content="width=1050, initial-scale=1">。
理想情况下，在智能手机上，
浏览 1提问于2014-03-30得票数 0
1回答
我试图为我的网页制作一个标题，标题中间有一个元素，标题中有一个对齐。
我唯一能想到的办法是：
使用浮点-
#中心Header{显示:内联块；高度: 100%；垂直对齐:中间；}#社会化链接{高度: 100%；显示:内联块；垂直对齐:中间；浮动:右；}
使用绝对定位-
#中心Header{显示:内联块；高度: 100%；垂直对齐:中间；}#社会化链接{高度: 100%；显示:内联块；垂直-对齐:中间；位置:绝对；右:10 100；}
问题是，使用这两种方法，社交链接/图像不再垂直对齐到标题，而是拥抱页面的顶部，尽管我将它们设置为100%的内嵌块，并且垂直对齐:中间。(我尝试这
浏览 3提问于2014-08-18得票数 0
回答已采纳
好的，默认情况下，点击标记时，标记在地图上居中。问题是，我有很高的infoView，从布局中膨胀，它显示在地图边界之外。我能做什么，水平居中别针，并将其定位在地图中心下方，以使infoWindow可见。
浏览 4提问于2013-04-19得票数 8
回答已采纳
我不想将div居中，我希望div的内容居中。我想要水平和垂直对齐。
很抱歉，如果这太简单了，或者其他什么，但是这是一种麻烦，让它正确的。
格雷
我正在使用IE7
浏览 0提问于2010-12-21得票数 3
2回答
显示后使其余元素居中:无
、、、
注意:我正在使用Flexbox
当调整屏幕大小时，我使用"display:none“来删除一些元素，这些元素将不再适合缩小尺寸，但是一旦它们被删除，仍然显示的元素不再在它们的列中水平居中。
例如：(这不是一个简单的示例代码)
|-------------------------------|
| | | | |
| 1 2 | 1 2 | 1 2 | 1 2 |
|-------|-------|-------|-------|
例如:现在，在"2“元素具有"display:none”属性后，剩下的内容
浏览 0提问于2015-09-23得票数 4
我的<ul>元素有一些包含文本的<li>元素，还有一个包含图像的元素。我希望它们出现在一行中，在父元素内水平居中，以及它们的<li>内容垂直和水平地居中。我有以下代码：
到目前为止，这是一个很棒的，但是，我有一个问题，<li>包含一个<img>。它的位置高于其他<li>元素。
我找不到多少资源来帮助我处理这个问题。也许我不喜欢搜索，但我找到了一个链接：。似乎我们也有同样的问题，有人建议我们使用：
display: table-cell;
vertical-align: middle;
但是，当我尝试使用它时，相对于其父容
浏览 2提问于2015-05-02得票数 0
回答已采纳
我所要做的就是对图像进行居中/拉伸，而不考虑显示器的大小，这样它就会始终用完整的图像填充背景。不超过或小于该图像的完整水平。有什么建议吗？
浏览 1提问于2011-08-08得票数 0
回答已采纳
2回答
我很难在bootstrap 4列中对齐一些图像。我已经尝试使用CSS属性text-align: center，这将使图像水平居中。我的列占据了大量的视图端口，所以我还需要图像垂直居中。 下面是我的react组件返回的内容。class="img13“是我想要的中心。 <div id="border">
<div class="container">
<div class="row tower">
<div class="
浏览 65提问于2020-08-18得票数 1
回答已采纳
5回答
如何使页面内容居中，使其在每种屏幕大小上居中？例如，在上，如果我调整浏览器的大小，中心内容将向左移动，直到到达浏览器窗口。某些背景元素在水平方向上无限延伸(顶部为深灰色，中间为浅灰色，等等)。我可以在我的笔记本电脑和iMac上打开这个网站，它是居中的。我想我可以使用绝对定位从左侧移动内容x像素量，但这不起作用，因为300像素在小屏幕上居中内容，不会在大屏幕上居中。
所以在本质上，我想复制Allegorithmic网站的功能，有无限的水平背景，但有一定的内容始终保持“中心”。
浏览 2提问于2011-08-28得票数 5
回答已采纳
我想在ScrollView中显示一个可缩放的图像。另外，ViewController应该包含一个工具栏。
我设置了以下限制：
工具栏:左: 0，右: 0，底部布局指南:0
ScrollView:顶部布局指南: 0，左: 0，右: 0，工具栏:0
ImageView:每个0到ScrollView，垂直和水平地居中
然而，图像视图从来没有在顶部..。你知道为什么和如何解决这个问题吗？
浏览 0提问于2017-02-28得票数 0
我有一个链接，后面有一张图片，图片应该居中。我需要定位链接和图像，使他们在水平中心，但偏移到左边的一些像素。
我有一个固定宽度的网站，这是居中的页面，这些链接必须在相同的位置，无论屏幕分辨率。
以下是一幅ascii图，以帮助解释我的意思：
___________________________________
| | | |
| | | |
| | | |
| |<>
浏览 4提问于2010-08-12得票数 1
3回答
我有一个水平居中的网页，但相当短-它只占垂直页面的一半。我想让它居中。如何使标签垂直居中？我不能有一个静态的高度，所以这不是一个选项。如果CSS不够强大，我可以使用Javascript来完成吗？谢谢!
浏览 0提问于2011-08-22得票数 2
回答已采纳
默认情况下，颜色盒在屏幕上垂直和水平居中显示。有没有办法改变这一点，例如，从顶部垂直居中到10%？
浏览 0提问于2010-07-28得票数 8
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
