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
回答已采纳
5回答
当我尝试垂直对齐内部DIV居中时，我的居中不起作用...
我的问题出在哪里？
CSS代码：
#page_bar
{
width: 100%;
height: 30px;
background-color: white
}
.page_bar
{
width: 800px;
height: 30px;
display: table-cell;
vertical-align: middle
}
HTML代码：
<div id="page_bar">
<div class="page_bar&
浏览 0提问于2012-08-18得票数 0
回答已采纳
4回答
我有一些文本在我的html网站上使用div标签，所以我可以居中的文本，但它不会居中。
这是我放入HTML中的内容
<div id="info">
Welcome
</div>
这是我放在CSS中的内容
#info {
color: #0F0;
font-size: 20px;
text-align: center;
}
我已经使用了正确的css代码来居中文本，但由于某些原因，它不会居中。有谁有什么想法吗？
浏览 42提问于2017-02-12得票数 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
回答已采纳
如何在Jupyterlab中居中对齐Altair图表，使其在导出的HTML中保持居中？ 以下代码使notebook中的绘图居中；但是，当我将notebook导出为HTML时，输出为空/空白。 import altair as alt
import pandas as pd
from IPython.core.display import display, HTML
df=pd.DataFrame({'a': [1,2,3], 'b': [2,3,4]})
c=alt.Chart(df).mark_bar().encode(
x='a'
浏览 37提问于2020-11-06得票数 1
回答已采纳
1回答
我正在尝试使用标准HTML或HTML5创建门户网站页面。我理解HTML的概念，但是来自软件背景的我对布局等更复杂的部分确实有一点困难。
布局的基本前提非常简单:一个居中的图像，周围有许多按钮。我有一个艰难的时间与布局的按钮。
布局的可视表示：
目前，中心图像正在显示，但我很难定位按钮元素。
我对如何布局网页有点困惑。我应该用<buttons elements surrounding this>做一个居中的<div>标签，还是用一堆其他居中的<div>来居中。
此外，如果使用HTML5有更好的方法来解决这个问题，我会非常感兴趣。
非常感谢，
J
HTML代码
浏览 4提问于2014-01-09得票数 0
当我想在居中的父div中向左或向右浮动子div时，整个设计会向左或向右移动，具体取决于浮动。那么，如何浮动子div，并使居中的父div居中。
HTML：
<div id="parent">
<div id="child-left"></div>
<div id="child-right"></div>
</div>
CSS：
#parent{
padding: 0 auto;
width: 600px;
}
#child-left{
float: le
浏览 3提问于2012-10-10得票数 4
回答已采纳
下面的html创建一个页面，页面的<html>高度= 8，<body>高度= 0，但是具有“居中”的div也在屏幕上垂直地居中。怎么会这样呢？
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div style=" height:100px; width:200px; margin: auto; position: absolute; top: 0; left: 0; bott
浏览 9提问于2015-06-22得票数 1
回答已采纳
例如，它们导致了关于自动边距的完全不同的行为。
看看这把小提琴：
<style>
.fixed {
display:fixed;
top:0px;
left:0px;
right:0px;
bottom:0px;
}
.centered {
position:absolute;
margin:auto;
top:0;
left:0;
right:0;
bottom:0;
}
</style>
<div class="fixed">
<div
浏览 0提问于2015-08-11得票数 1
当地址栏和工具栏显示时，我想在iPhone上垂直居中放置一个div。当浏览器全屏时，我可以让它在风景中工作……
但是一旦工具栏出现，div就不会居中。
有没有办法在不使用Javascript的情况下使div相对于窗口的可见部分居中？
下面是我当前的代码：
body,
div {
margin: 0;
padding: 0;
}
div {
width: 100%;
height: 50px;
position: absolute;
top: calc(50vh - 25px);
background-color: yellow;
}
<!D
浏览 0提问于2015-03-02得票数 2
要使一个HTML元素居中，我可以使用CSS left: 50%;。但是，这会使元素相对于整个窗口居中。
我有一个元素，它是一个<div>元素的子元素，我希望该子元素相对于这个父<div>居中，而不是整个窗口。
我不希望容器<div>的所有内容都居中，只有一个特定的子级。
浏览 178提问于2011-07-25得票数 204
回答已采纳
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
回答已采纳
2回答
我有一个非常简单的测试html站点，如下所示：
<html>
<body>
<div style="height:500px">
<img style="height:200px; vertical-align:middle;" src="http://i.imgur.com/BidLR.jpg" />
</div>
</body>
</html>
但是图像不会在div中垂直居中显示。(至少在Google Chrome中是这样)。图像居中渲染需要什么？
浏览 0提问于2012-09-27得票数 1
回答已采纳
与其在1div中用一个已经居中的徽标对文本进行居中，不如创建2个div，并在顶部div的底部和底部div的顶部居中？我已经设法在中心的标志在页面的中心，但只能设法在屏幕顶部的文本居中。我想把下面的标志。
.home-logo {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
.homepage {
position: relative;
width: 100%;
height: 100%;
}
.home-text {
font-size: 28
浏览 1提问于2018-10-10得票数 1
回答已采纳
7回答
我有以下HTML：
<div class="outer">
<div class="inner rotate">Centered?</div>
</div>
div.outer是一个窄的垂直条带。div.inner旋转90度。我想要文本“居中？”在其容器div中居中显示。我事先不知道这两个div的大小。
这很接近：。您可以从jsfiddle中看到，在应用transform: rotate(-90deg)样式之前，文本垂直居中，但在应用之后，文本在垂直方向居中。当div.outer很短时，这一点尤其明显。
是
浏览 0提问于2013-02-28得票数 84
回答已采纳
4回答
Bootstrap中的中心导航栏
、、、、
如何使用bootstrap将菜单居中？
HTML：
<nav class='navbar navbar-default'>
<div class='container-fluid container'>
<div class='navbar-header'>
<a class='navbar-brand' href='#'>Title</a>
</div>
<div id=&#
浏览 2提问于2016-10-10得票数 1
7回答
如何使图像居中？
、、
这张图片不应该居中吗？如果不是，如何使其居中？
<div class="logo-area">
<div class="logo-bg">
<a href="index.html"><img src="images/logo.jpg" align="middle" /></a>
</div>
浏览 0提问于2013-06-14得票数 1
2回答
我对文本进行了包装，以便更好地包含它，但它使它不再居中；它将它对齐到页面的左侧，但我需要它居中。
我最初根本没有样式部分，但我想我需要它来换行我的文本，因为我不想因为内容的性质而跨越整个页面。
简而言之，我只需要我的内容再次居中，但我需要文本的430px换行。
谢谢。
代码如下：
<!DOCTYPE html>
<html>
<title>contact</title>
<body>
<div class=“panel”>
<center>
<img src=img/ab
浏览 1提问于2018-05-26得票数 3
3回答
我得到了一些类似于jsfiddle的html：
使用一些jquery，程序为每个div分配新的高度，因此外部div比内部div大。它还重新定位div，使其在父级中垂直居中(使用top)。
问题是，即使div与垂直居中对齐，它们包含的文本也不是垂直居中。
有没有办法将所有包含的文本移到div的垂直中心？
谢谢麦克斯
浏览 0提问于2012-01-15得票数 1
回答已采纳
代码如下： body {
position: relative;
font-size: 30px;
}
#middle {
width: 420px;
height: 500px;
margin: 100px auto 0;
border: solid;
}
#left {
position: fixed;
border-style: solid;
border-color: red;
top: 50%;
transform: translateY(-50%);
left: 0;
}
#right {
position: fixe
浏览 25提问于2021-11-01得票数 0
回答已采纳
我的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
我正在尝试编写一个符合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
1回答
我正在使用，我试图创建一个包含三个span3 div的居中行的网格。
我试图通过将三个span3s封装在一个居中的span9中来实现这一点，但这似乎行不通。
我的问题是，div没有正确地居中，而且由于我是HTML和CSS新手，我真的需要一些帮助。谢谢!
HTML
<div class="row">
<div class="span9 center">
<div class="span3">
<p>THUMBNAIL1</p>
<
浏览 2提问于2013-08-31得票数 1
回答已采纳
1回答
我有一个简单的html页面，其中我有一个居中的“弹性”标题。我想有一个居中的标志在它的顶部。我在div标签中使用align=“align=”来实现居中。当我在徽标上使用z-index时，它不起作用，除非我将position:relative更改为position:absolute，这打破了我的居中设置。我在chrome 8.0.552.224和FF 3.6.13中测试它
<!DOCTYPE html>
<html>
<head>
<title>Vassily's page!</title>
<style type=
浏览 0提问于2011-01-09得票数 0
回答已采纳
我正在尝试在任何屏幕大小的页面上获得一排居中的图像。
.content img {
width: 30%;
height: auto;
}
.content {
position: absolute;
top: 50%;
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
<body class="body_background">
<div class="content">
<a href="/index
浏览 0提问于2019-06-16得票数 0
4回答
在下面的文档中，是否可以将内部div水平居中，或者以其他方式使文本V和H在outer类div中居中？
一些约束(很抱歉没有在开始时指定)：1.不应该指定固定的宽度，否则解决方案很简单；2.没有JavaScript，只有纯CSS和HTML。
<!DOCTYPE html>
<html>
<head>
<title>the title</title>
<style>
div.outer {
/* ? */
}
div.inner {
浏览 1提问于2012-09-29得票数 0
回答已采纳
我有一个div，需要在另一个div内水平地居中。问题是，内部div几乎是居中的，也就是说，它是居中的，但是有一个左边距/填充(我无法确定哪一个)在5-10 it左右。如何使内部div以外部div为中心？
HTML：
<div class="outer">
<div class="inner">
// stuff
</div>
</div>
CSS：
.outer {
position:relative;
display:inline-block;
width:
浏览 2提问于2013-12-19得票数 0
回答已采纳
如果使用下面的代码并创建一个html页面，您将看到蓝色标题div左对齐。尽管header元素具有固定宽度，并且左/右边距设置为自动，但仍会出现这种情况。
唯一能让表格居中的方法是删除display: table -cell属性。
我需要它既要居中对齐(水平对齐)，又需要子元素垂直居中(通过竖直对齐和显示指令)。
如何使div既居中对齐又垂直对齐？
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transit
浏览 0提问于2010-12-03得票数 0
回答已采纳
1回答
HTML
<div id="divTop">divTop</div>
<div id="divBottom">divBottom
<div id="divCenter">divCenter</div>
</div>
CSS
html, body{
height:100%;
}
#divTop{
height:50px;
background:#008080;
color:#ffffff;
text-align:center;
v
浏览 1提问于2013-07-15得票数 0
回答已采纳
这听起来很奇怪，我知道，但是我很难让一段文本稍微下移一点，这样它就会居中于它所在的标签上。
它看起来是这样的：
我希望购买垂直居中。
下面是html：
<div class="row-2">
<ul>
<li><a href="index.html" class="active">Buy</a></li>
</ul>
</div>
浏览 7提问于2011-04-08得票数 19
回答已采纳
4回答
我正在尝试让提交按钮居中页面。我的html代码是：
<div class="container-fluid">
<div class="row" style="margin-right:0;margin-left:0">
<form method="POST"
action="https://api.instagram.com/oauth/authorize/redirect_uri=http://hanie-asemi.ir/laravel/public/instagram/
浏览 0提问于2017-07-08得票数 1
如何让遮罩div中的center div居中对齐？ 样式： <style type="text/css">
.mask {
position: absolute; top: 0px;
filter: alpha(opacity=60);
background-color: #777;
z-index: 1002; left: 0px;
opacity:0.5; -moz-opacity:0.5;
width: 100%;
height: 100%
浏览 50提问于2018-07-20得票数 0
回答已采纳
我正在努力实现以下目标:我在页面的中央有一个垂直和水平的中间div (wrapper)。在该div中，我希望有另外2个div，其中一个将包含徽标，另一个将包含一些文本。徽标图像还必须与其div的中心垂直和水平对齐。目前，我所拥有的是：
下面是我的HTML和CSS的jsfiddle：
我如何才能使logo div居中(仅水平居中，并具有10px的页边距-顶部)，并使logo图像在该div内居中，水平和垂直居中，就像现在一样？
浏览 2提问于2012-10-16得票数 1
回答已采纳
我是HTML和CSS的新手。我已经尝试了下面的代码
<!DOCTYPE html>
<html>
<head>
<title>Center</title>
</head>
<body>
<div id="div1" style="width:300;background-color:olive">
<div id="div2" style="width:100px; margin-left:auto; marg
浏览 5提问于2015-03-10得票数 2
回答已采纳
1回答
固定导航栏
、、、、
我有一个导航栏，我想保持固定和居中。我当前将工具栏居中，但当我添加“position:fixed”时，它会将导航栏一直移到屏幕的左侧。我的导航栏目前离屏幕顶部大约20% (居中)。
CSS：
div.social-wrap{
width: 500px;
margin: 0 auto 0 auto;
padding-top: 25px;
}
HTML：
<div class="social-wrap">
<ul>
<li><a href="index.html" class="
浏览 0提问于2013-04-16得票数 0
回答已采纳
1回答
无法在CSS中居中页脚
、、、
我无法使页脚居中。所有内容都在页面居中，并设置为1280px，因此它不会占据整个页面的宽度。问题是除了页脚之外，页面上的所有内容都居中。它是正确的宽度，但页脚被用力向左推。你知道我错过了什么吗？
下面是当前页脚的样子：
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="../Css/Style.css">
<link rel="
浏览 1提问于2017-08-08得票数 0
2回答
我试图使2个图像和这些图像之间的文本顶部栏。但是我不能把文本居中。我正在为移动设备做这件事。
这是我的html
<img src="1.jpg" />
Company Name
<img src="2.jpg" />
我尝试了下面的代码，但不起作用。我无法将文本居中
<div style="float:left"><img src="1.jpg" /></div>
<div>Company Name</div>
<div style="
浏览 1提问于2013-06-12得票数 0
回答已采纳
我只是想在页面上居中放置一个div。它可以在chrome中工作，但在例如，div仍然在左边：
<html>
<head></head>
<body>
<div id="container" style="margin:0 auto; width:200px;">
test
</div>
</body>
</html>
我读过的所有文章都说，要使块元素居中，只需添加margin:0 auto并指定宽度，所以我不知道为什么这不起作用。
我正在IE 7
浏览 2提问于2010-06-08得票数 0
回答已采纳
3回答
你好，我有一张html中的卡片，里面有一个按钮，我想在右边显示这个按钮，并在卡中居中。我想用类mydivbutton在左边显示div，并在卡片中居中。
<div class="mycard">
<div>
<div class="">
<a class="" href=""
target="_blank">
developpeur
&
浏览 9提问于2022-01-31得票数 -2
1回答
当IE8是“正常”标准兼容模式时，下面的html和css会做它应该做的事情，并适当地将红色div居中。然而，在兼容模式下，它不会居中。这里有人能解释原因并提出替代方案吗？
<html>
<head><title>test</title></head>
<body>
<div
style="position: absolute;
margin-left: auto;
margin-right: auto;
left: 0;
浏览 1提问于2011-02-07得票数 1
回答已采纳
3回答
我试图在div中水平居中显示一些文本。
CSS：
#parent {
background-color: #eee;
height: 48px;
text-align: center;
}
#colLeft {
background-color: #ff8b8b;
height: 48px;
display: inline;
float: left;
}
#colRight {
background-color: #c3d0ff;
height: 48px;
display:
浏览 0提问于2012-12-17得票数 1
回答已采纳
6回答
我的网页位于960px宽的DIV中，我使用以下代码将此DIV居中：
html,body{background: url(images/INF_pageBg.gif) center top repeat-y #777777;text-align:center;}
#container{background-color:#ffffff;width:960px;text-align:left;margin:0 auto 0 auto;}
我需要html/body的背景图像来平铺页面的中间，它做到了，但是如果浏览器中可见的窗格是奇数个像素宽度，那么居中的背景和居中的DIV就不会对齐。
这只发生在FF中
浏览 0提问于2008-09-22得票数 3
回答已采纳
我试图在页面中间居中放置一个元素。我可以将其居中，但如果我垂直调整页面大小，直到视图高度小于居中元素，元素将垂直移出屏幕，而不显示滚动条。你可以在这里看到这个问题的演示：
* {
padding: 0;
margin: 0;
}
html, body {
height: 100%;
}
.outer {
text-align: center;
position: relative;
top: 50%;
transform: translateY(-50%);
}
.inner {
display: inline-block;
width: 400
浏览 1提问于2017-02-23得票数 1
我有一个div，我希望它的宽度是基于div中的文本的动态宽度。我发现这可以通过将div的display设置为inline-block来实现；然而，现在我不能让div与display一起居中。我不想在div或html主体上使用text-align: center，因为我不希望div中的文本居中。不管有没有内联块，我都愿意解决这个问题。只要div居中并且div宽度是基于文本的动态变化，那么我就很高兴。
<div id="wrapper">
<p>Text that will change div width.</p>
</div&g
浏览 0提问于2020-12-11得票数 0
我尝试使用一个位于菜单下面的div，拉伸它直到到达页脚(以防没有足够的内容)，然后居中。我可以使用绝对定位来拉伸它，但它不会居中；我可以将它居中，但它不会拉伸。代码看起来像这样：
HTML
<div id="container">
<div id="header"></div>
<div id="content"></div>
<div id="footer"></div>
</div>
CSS
html, bo
浏览 4提问于2014-04-29得票数 1
就像标题中所说的那样，我想在屏幕中间对一些框(比如说登录框)进行居中。在此框下，我想显示其他几个框(附加信息/免责声明等)。
编辑:更准确地说:居中登录框，必须是垂直和水平居中，并停留在那里。附加框应该出现在居中的登录框下面。
做这件事最简单的方法是什么？
HTML：
<div id="centeredBox">
I am centered and have some undefined size (cause I could display some image
</div>
<div id="underCenteredBox&#
浏览 5提问于2015-11-12得票数 1
回答已采纳
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
3回答
从底部滑行
、、
我有一个640x480 div，它在我的HTML页面中垂直和水平地居中。我想要一个div从div的底部边缘出现。我要那个div是640x400。从本质上说，可以看到原始div的前80 be。
我的问题是，如何使新的div从居中的div的底部边缘出现？
浏览 2提问于2013-08-01得票数 0
回答已采纳
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
3回答
我可以成功地在CSS中对文本框进行居中。但是居中的Textboxes没有对齐。我如何对齐它们？
我的html代码：
<div data-bind="dxList: { dataSource: dataSource}">
<div data-options="dxTemplate : { name: 'item' } ">
<div class="wrapper">
<div data-bind="text: name
浏览 3提问于2016-11-16得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
