3回答
我正在尝试在Javascript中居中按钮，以便它在页面中水平居中。现在，我的按钮在html文件中，所以我不知道如何使用CSS将其居中，因为它在Javascript中。 TLDR:在Javascript中，如果我声明了一个按钮btn，我应该写什么代码来水平居中它？ 我在互联网上到处寻找一种使用Javascript使按钮居中的方法，但都无济于事。我希望你们都能帮助我。 谢谢!
浏览 501提问于2021-06-26得票数 0
回答已采纳
1回答
垂直和水平对齐
、、、
我的问题如下：
我垂直居中了一个div。但是，我想将另一个div水平居中。问题是我没有设法使它水平居中。
(X)HTML：
<body>
<div id="strut"></div>
<div id="page">
<div id="inner_page">
<h1>Galidie "jQzz" Clément</h1>
</div>
</div>
CSS：
html, body {
m
浏览 3提问于2012-10-20得票数 2
回答已采纳
我正在努力实现以下目标:我在页面的中央有一个垂直和水平的中间div (wrapper)。在该div中，我希望有另外2个div，其中一个将包含徽标，另一个将包含一些文本。徽标图像还必须与其div的中心垂直和水平对齐。目前，我所拥有的是：
下面是我的HTML和CSS的jsfiddle：
我如何才能使logo div居中(仅水平居中，并具有10px的页边距-顶部)，并使logo图像在该div内居中，水平和垂直居中，就像现在一样？
浏览 2提问于2012-10-16得票数 1
回答已采纳
我试图使一个链接，其中有一个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
回答已采纳
我正在尝试编写一个符合HTML5的文档，该文档将通过W3C验证器：。
验证器抱怨标签的每次使用，并建议我使用CSS。不幸的是，CSS似乎不能将块水平居中。它可以使用' text -align: center‘属性将文本居中，但尝试居中表格和图像会失败。
我在上读过"CSS居中指南“，但它的所有示例都不能水平居中表格或图像(至少在Firefox36.0上是这样)。谁能建议一下如何使这张桌子居中？
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" co
浏览 1提问于2015-04-02得票数 2
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
我的HTML中有一个div，如下所示：
<div id="audio"><span>فایل های صوتی</span></div>
这两个元素的CSS如下所示：
#audio{
width: 100%;
height: 11%;
background-color: #3F1954;
}
span{
font-size: 20px;
color: white;
text-align: center;
font-family: btitr;
}
我希望跨度在div中居中(水平和垂直)，当我放大或缩小我的页面时，它
浏览 2提问于2014-10-02得票数 2
3回答
我这里有一个jsfiddle -
我需要一个覆盖的页面和文本的全部宽度和高度是死心。
我可以用display: table做到这一点；但我需要html和body上的height: 100%；。
这在实际代码中造成了问题。
是否有可能有100%覆盖与居中的文本而不显示:表；
我这里有一个例子--
我可以水平居中，但不能垂直居中。
在第二个例子中是否可以将文本水平居中。
html, body{
height: 100%;
}
.block{
background: rgba(230, 97
浏览 1提问于2015-04-24得票数 0
5回答
我不得不承认，我真的不太了解HTML，但我正在努力学习。我有一个图像在DIV中居中，但它并不是真正的水平居中。它的左边缘是中心所在的位置，如下所示：
-|image
做什么，做什么.
编辑一些代码：
<style>
#Outer {
position:relative;
height:100%;
width:100%;
text-align: center;
}
#Picture {
position:fixed;
top: 30%;
}
</style>
另外，我在垂直和水平方向上居中。垂直方向工作得很好。
浏览 0提问于2011-11-05得票数 1
回答已采纳
5回答
我已经用谷歌搜索过很多次了，我不明白为什么我的div不会居中。
HTML：
<body><div id="mydiv"></div></body>
css
*{
margin:0;
padding:0;
}
html,body{height:100%; width:100%;}
#mydiv{
height:50%;
width:50%;
background:grey;
margin:au
浏览 0提问于2013-03-14得票数 1
回答已采纳
1回答
我想在html/css (没有js)中制作一个从数据库中带水平滚动条的图片块，这样无论它们的高度如何，它们都会居中。
我找到的将未知高度的图片居中的唯一解决方案是使用display: table或display: flex。但我发现制作水平滚动条的唯一解决方案是使用display: block。有没有办法同时完成这两项任务？
编辑：
就像这张照片上的一样。我的意思是图片应该居中，不同的高度：
浏览 6提问于2013-12-24得票数 0
如何使用javascript、css和/或html在表格单元格中的图像上居中显示文本？
我有一个包含图像的HTML表-所有图像的大小都相同-并且我想在每个图像上居中放置一个文本标签。标签中的文本大小可能不同。水平居中并不难，但垂直居中却很难。
附录:我最终不得不使用javascript使用固定大小的div和绝对定位来可靠地将文本居中；我只是无法让它以任何其他方式工作。
浏览 2提问于2008-09-18得票数 1
回答已采纳
3回答
我在html中的一个元素上有下面的css。它以水平居中的图像，但它不是在底部的页面，我需要它。如何更改此css以保持其水平居中，但使其位置:固定到底部？
background: url(loginv1.png)50% 50% no-repeat;
background-size: 75px 25px;
height: 40px;
width: 120px;
display: block;
margin: 0 auto;
浏览 7提问于2014-04-23得票数 1
回答已采纳
6回答
我在找圆点的html代码。不是句子末尾的点，而是用来水平分隔项目的点。
Item 1 . Item 2 . Item 3
传统的点在线条的底部居中，而我正在寻找的点在中间居中。
浏览 2提问于2011-08-31得票数 222
回答已采纳
有时我希望div中的元素水平或垂直居中(而不是实际编写代码居中)，显然设计者在他们的应用程序中有网格来帮助他们做到这一点。
有没有可能在css中创建类似这样的东西来绘制网格，或者为特定的div绘制一个简单的十字，这样就可以更容易地在该div中移动元素(因为这些线条可以指导我了解元素的居中位置)？
谢谢！
浏览 2提问于2017-02-02得票数 1
4回答
中心DIV水平和垂直方向
、、、
我有一个HTML结构：
<div class="metaboxdet">
<div class="metd">
<h1>Hello World!</h1>
</div>
</div>
这里的问题是，我不能将div "metd“水平和垂直地居中。我试过调整顶部、底部、左边和右边，但结果不太准确。有没有一种方法可以让我水平地和垂直地动态地居中。
请检查以查看它的实际运行情况。谢谢!
浏览 10提问于2015-06-13得票数 1
回答已采纳
6回答
我有一个问题与居中的HTML (垂直和水平)的div。我的代码看起来像这样：
<div id="container">SOME HTML</div>
#container{
width: 366px;
height: 274px;
margin: 50%;
top: -137px;
left: -188px;
position:absolute;
}
只有chrome将这个div居中到屏幕的中间。
浏览 4提问于2012-04-24得票数 5
回答已采纳
如何使html "ul“元素与水平对齐"li”在bootstrap4 (水平+垂直)中居中
<section>
<div class='row'>
<div class='col-sm'>
<ul>
<li>A</li>
<li>B</li>
<li>C</li>
浏览 3提问于2020-08-05得票数 0
4回答
我想让div水平居中，css代码是这样的：
<style type="text/css">
#footer{
position: fixed;
bottom: 20px;
background-color: red;
width:500px;
margin: auto;/*left:auto; right:auto;*/
}
</style>
和html代码：
<body>
<div id="footer">hello world</div>
&l
浏览 0提问于2013-04-17得票数 9
回答已采纳
2回答
到目前为止，我可以水平居中图像，但一旦我尝试垂直居中(添加上边距)，父div也会下移(这是我不想要的)。
这是我正在讨论的图片：
我认为最好的选择是将其设置为绝对位置，但我在水平居中时遇到了问题。
<div id="header">
<div id="container">
<div id="logo">
<a href="index.html"><img src="images/logo.png" />&l
浏览 0提问于2012-08-10得票数 1
回答已采纳
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
回答已采纳
1回答
我遇到了一个棘手的问题。我需要在缩放图像后居中水平和垂直图像。这是我的HTML：
li {
float: left;
padding: .78125%;
width: 31.25%;
/*li tag height and width is not fixed for screen adaptation*/
}
<!-- The code run in mobile browser.So do not think too much fu*king compatibility-->
<ul>
<li>
<a href
浏览 2提问于2015-08-03得票数 1
在REACT中，我想要并排放置三个div，它们之间有一个很小的边距，并且水平居中。 当屏幕宽度变得太小时，我希望最右边的div移到前两个div的下方，但仍然水平居中。 当屏幕变得更小时，我希望所有三个div都在屏幕中心的一列中。 这很容易通过图像实现： Html (html的REACT风格)： <div id='container'>
<img src={image}/>
<img src={image}/>
<img src={image}/>
<div/> CSS： #container
浏览 23提问于2020-06-12得票数 0
回答已采纳
1回答
我可以在以下方面提供帮助吗？ 我有下面的HTML来制作一个全屏棕色的DIV： <div style="position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background-color: brown;">
<app-text-cloner style="display: flex; justify-content:center; align-items:center;"></app-text-cloner> app-text-cloner的
浏览 24提问于2021-07-14得票数 0
回答已采纳
我正在尝试使用引导类img-responsive和center-block将图像居中对齐。但不知何故，当从浏览器(IE和chrome)测试时，图像不会水平对齐。
奇怪的是，当尝试使用fiddle时，相同的html会将其居中对齐。
你能帮我找出我可以在代码中纠正什么，以便图像在页面上水平居中？
Fiddle在
代码：
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/>
<div class=&#
浏览 22提问于2016-07-28得票数 0
回答已采纳
我有一个像这样的html：
.image-detail {
height: 100%;
width: 100%;
display: block;
position: relative;
}
canvas {
display: block;
}
.image-detail-canvas {
-moz-user-select: none;
-webkit-user-select: none;
max-width: 100% !important;
max-height: 100% !important;
position: absolute !impor
浏览 2提问于2016-09-27得票数 5
如果文本适合一行，是否可以水平居中对齐；如果文本占多行，是否可以水平居中对齐；如果文本占多行，是否可以水平居中对齐(最好是，但不是必须的，不要使用white-space: normal )？
浏览 0提问于2012-03-18得票数 5
回答已采纳
2回答
我想把这个文本垂直地和水平地放在一个容器内，它在一行和一个列中，设置为12，但我只能让它水平地而不是垂直地居中。我尝试了Flex，但是它将页面中的所有对象移动到中间，我只想让这个对象居中。
HTML：
<div class="container-fluid home">
<div class="row">
<div class="col-md-12" id="text">
<p>Hello World!</p>
</
浏览 6提问于2016-12-13得票数 1
回答已采纳
2回答
我有一个div，我想定位在一个页面的中心(垂直和水平)。
对于水平对中，我在div周围使用了中间的标记，对于垂直对中，尝试了几种方法，但它们都没有真正工作。
查看代码：
CSS：
.vcenter{
height: 50px;
width: 50px;
background: red;
vertical-align: middle;
margin-top: calc(50% - 25px);
}
HTML：
<center>
<div class="vcenter">
</div>
<center&
浏览 4提问于2016-04-18得票数 2
回答已采纳
如何使用flexbox布局创建垂直的div堆栈(列)，其中一个div锚定在容器的底部？
|--------|
| div1 |
| div2 |
| div3 |
| |
| |
| |
| fixed1 |
|--------|
例如，在此中，我希望项目1、2和3水平居中，垂直与顶部对齐，固定项目水平居中，垂直与底部对齐。
HTML
<div class="container">
<div class="item">Item 1</div>
<div
浏览 0提问于2015-05-01得票数 4
3回答
我在使用了JsFiddle。我将其更改为将div显示为方形对话框(水平和垂直居中)。结果是在。
如你所见，水平居中很容易，但我不能让它垂直居中。有人知道如何用纯CSS做到这一点吗？
编辑代码如下：
<div class="blind">
<div class="wrapper">
<div class="main">
I'm your div with an aspect-ratio of 1:1!
</div>
<
浏览 0提问于2013-12-02得票数 0
4回答
我不能在我的div内水平地调整我的菜单。它已经垂直地居中了，但是我如何用CSS水平地居中呢？谢谢你的建议。
代码：
<div class="container-2">
<div class="menu">
<ul class="navbar-header nav menu-nav">
<li><a href="1.html">1</a></li>
浏览 5提问于2014-06-30得票数 1
回答已采纳
我正在尝试居中具有背景视频容器的图像。我想让它在垂直和水平方向上精确居中。目前，我只能将图像水平居中，但在垂直居中时遇到困难。当我将图像居中时，它不会响应。有什么想法吗？
这是它在我的标题区域中的样子：
HTML代码：
<div class="header-container">
<div class="video-container">
<video preload="true" autoplay="autoplay" loop="loop"
浏览 15提问于2017-02-13得票数 0
1回答
flexbox (myflex)中有三个按钮(按钮1、按钮2和按钮3)。
我怎样才能把这个flexbox放在屏幕底部并水平居中呢？
我可以将其居中，但不能将其放在屏幕底部并使其成为粘性页脚。
#myflex {
display: flex;
//position:fixed;
bottom: 20px;
justify-content: center;
bottom: 10px;
}
<div id="myflex">
<button class="button button1">button 1</bu
浏览 2提问于2016-04-04得票数 0
1回答
我正在尝试实现以下网页元素的配置：
左图标图像<-padding->水平居中图标图像<-padding->右图标图像
每个图标下面都有一些相对于它自己的中心居中的文本。使用HTML和CSS实现这一点的最好方法是什么？
浏览 4提问于2014-02-07得票数 0
3回答
我正在尝试在一个水平居中的div中有一个iframe。它在火狐上运行得很好，但在IE8上就不行。下面是我的完整代码：
<!-- <!DOCTYPE HTML> -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head></head>
<STYLE type="text/css">
body {
background-color: silver; }
#container {
浏览 1提问于2012-11-07得票数 0
8回答
我正在使用HTML，并且我希望将<td>的文本与每个单元格的中心对齐。
如何将文本水平和垂直居中对齐？
浏览 74提问于2012-01-24得票数 297
回答已采纳
我正在试着写一个html页面，我可以把任何图像url放进去，它显示的图像与黑色背景，在页面上垂直和水平居中。
我有这个：
<html>
<body style="background: black;">
<img src="http://i.imgur.com/n8o1E.png" style="display: block; margin: auto; max-height: 100%; max-width: 100%">
</body>
</html>
它对比页面更高更薄的图像做
浏览 1提问于2012-12-08得票数 1
我有绝对定位文本内的相对文本包装，我希望它的垂直和水平中心。问题是，文本不会居中，因为它的宽度和高度会自动填充容器。如何解决这个问题，以便文本可以在div中居中，无论是垂直的还是水平的？
HTML
<div class="text-wrap">
<h3>Hello</h3>
</div>
CSS
.text-wrap {
height: 200px;
width: 120px;
position: relative;
border: 1px solid black;
}
.text-wrap h3 {
浏览 4提问于2017-07-29得票数 0
回答已采纳
6回答
我正在iOS设备上加载图像。我希望我的图像是水平居中，以及垂直中心与所有屏幕和方向。我试过用表格和td，它是对齐水平中心，但不是垂直对中。这就是我尝试过的html：
<table width=100% height=100%>
<tr>
<td style="text-align: center; vertical-align: middle;">
<img src="" />
</td>
</tr>
</tab
浏览 11提问于2014-01-02得票数 26
回答已采纳
4回答
我想在浏览器中显示一幅图像，这样：
如果图像小于浏览器视图，则图像以水平和垂直方向居中。
如果图像大于视口，则缩小图像以填充尽可能多的视口，而不调整图像的纵横比。同样，图像是以水平和垂直方向居中。
我不想使用JavaScript；最好的/最语义的HTML和CSS是什么？
更新我被要求澄清语义:图像是内容，是HTML中的唯一内容。
解决方案
@GionaF的想法让我找到了一个快乐(非常简单)的解决方案：
HTML
<!DOCTYPE html>
<head>
<title></title>
<LINK href=
浏览 6提问于2012-09-30得票数 13
回答已采纳
我似乎不能得到正确的html和样式编码。我可以在html中将文本水平居中，但不能使其垂直居中。我可能遗漏了一些简单的东西。这是我第一次使用堆栈溢出。我希望我做的每件事都是正确的。
<!DOCTYPE html>
<html>
<head>
<style>
.Header>p {
height: 100px;
text-align: center;
background-color: black;
padding-top=20px;
color: white;
浏览 3提问于2015-10-08得票数 0
我的简单页脚代码使用宽度为100%的表格，其中包含一个居中的td，其中的另一个表格包含链接，这使链接在可用空间中居中。只要有足够的水平空间来放置所有的链接，它就可以正常工作，但如果没有水平空间(即在手机上，portait)，它就不会换行。我如何保持居中，并允许必要的包装？
<footer>
<table style="width:100%">
<tr>
<td align="center">
<nav>
浏览 28提问于2018-02-07得票数 0
回答已采纳
我们如何使图像在下面的第二列中“适合”？这是Bootstrap 4，我希望右列与左列具有相同的高度，然后图像在保持纵横比的同时适合其中。我还希望它在水平和垂直方向居中。
HTML目前看起来如下所示：
<div class="form-row">
<div class="col">
<div class="form-group">
<!-- Upload Image option -->
</div>
浏览 0提问于2019-04-22得票数 1
我使用frame.setUrl(PATH);加载了一个html
它工作正常，但我想显示它水平居中，在框架对象上没有类似于面板小部件的.setHorizontalAlignment的方法。
如何在GWT frames中对元素进行居中
我使用Eclipse作为GWT Plugin的IDE。
编辑:我正在使用com.google.gwt.user.client.ui.Frame；
浏览 1提问于2014-05-05得票数 0
回答已采纳
1回答
我想要3个img在一条水平线上并居中，请帮忙？
我的代码: Html：
<div class="sidBilder">
<div class="row">
<div class="col-sm-12">
<div class="row">
<div class="col-sm-12 col-lg-4">
<img class="img-fluid imgCent
浏览 2提问于2018-04-05得票数 0
3回答
我正在尝试使用来实现一个水平和垂直居中的div，它保持浏览器100%的宽度和高度，其中文本应该垂直和水平居中对齐，但目前文本的顶行是居中对齐，而不是整个中心点在3行文本的中心。
有人知道怎么做到这一点吗？
我的HTML：
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Regret</title>
<meta charset="utf-8">
<link href='http:
浏览 2提问于2011-12-20得票数 1
回答已采纳
3回答
我在生成HTML/CSS布局时遇到问题。考虑这一点的最好方法是采用正常的水平居中页面布局。我只想让一个div从居中布局延伸到浏览器窗口的右边缘。
这应该可以流畅地与浏览器窗口大小调整一起工作。
浏览 0提问于2012-10-28得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
