如何将div垂直居中？
我正在尝试制作一个小的用户名和密码输入框。我想问一下，如何垂直对齐div？我所拥有的是：<div id="Login" class="BlackStrip floatright"> <div id="Username" class="floatleft">Username<br>Password</div> <div id="Form" class="floatleft"> <form action="" method="post"> <input type="text" border...
2024-01-10
将div中的两个元素垂直居中
我正在尝试垂直居中放置两个<p>元素。我在phrogz.net上按照教程进行操作，但仍然将元素放置在div上方，div下方，在div中顶部对齐。我会尝试其他方法，但是这里的大多数问题都只是指向该教程。此代码段用于网页顶部的横幅。.banner { width: 980px; height: 69px; background-image: url(../images/nav-bg.jpg); bac...
2024-01-10如何在div中垂直居中放置图像
我有这样的标记：<div> <img /></div>div高于img：div { height: 100px;}img { height: dynamic-value-smaller-than-100px;}我需要将图像放置在div的中间（在其上下具有相同的空白）。我试过了，它不起作用：div { vertical-align: middle;}回答：如果您的图像纯粹是装饰性的，那么将其用作背景图像可能是一种更语...
2024-01-10如何让一个div居中
1、新建一个html文件，命名为test.html，用于讲解CSS怎样让一个div居中。 2、在test.html文件中，使用div标签创建一个模块，用于测试居中效果。 3、在test.html文件中，设置div的class属性为test，下面将通过该class属性设置其css样式。 4、在test.html文件内，编写<styletype=text/css></style>标签，页面...
2024-01-10
# div垂直居中显示，背景不能点
本人小菜鸟一只，刚好需要用到这个，就刚好写了，主要是**transform: translate(-50%,-50%);**这个功能太强大了，好了，看下面1、先来张效果图2、新建两个div，一个包裹在外面，一个在里面 <div class="content"> <!--背景--><div class="div"></div> <!--居中的div--></div>3、就剩下写CSS了，话不多说，看图：.cont...
2024-01-10如何将所有浏览器的div垂直居中？
我想将divCSS垂直居中放置。我不需要表或JavaScript，而只需要纯CSS。我找到了一些解决方案，但是所有这些解决方案都缺少InternetExplorer 6支持。<body> <div>Div to be aligned vertically</div></body>如何div在所有主要浏览器（包括Internet Explorer 6）中垂直居中？回答：下面是我可以构建的最好的全方位解决方案...
2024-01-10如何在div中垂直对齐文本？
我试图找到最有效的方法来使div对齐文本。我尝试了几件事，但似乎都没有用。.testimonialText { position: absolute; left: 15px; top: 15px; width: 150px; height: 309px; vertical-align: middle; text-align: center; font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; ...
2024-01-10将div垂直居中放置在另一个div中
我想将添加到另一个div内的div居中。<div id="outerDiv"> <div id="innerDiv"> </div></div>这是我当前正在使用的CSS。 #outerDiv{ width: 500px; height: 500px; position:relative; } #innerDiv{ width: 284px; height: 290px; position:ab...
2024-01-10在div中居中放置图像
我已经将图像内的边框设置div为none。我现在想将该图像放在其包含div的中心。我曾尝试使用，margin: 0 auto;但没有用。我敢肯定，我忽略了一些愚蠢的事情，但是我想得到stackoverflow社区的帮助，所以这并不需要我花一个小时盯着屏幕来弄清楚。非常感谢。<body> <div id="wrapper"> <div id="banner"> ...
2024-01-10将div对准中心
我想将a浮动div到中心。可能吗？text-align: center在IE中无法正常工作。回答：本身没有浮子居中。如果要将块元素居中放置在另一个元素中，请执行以下操作：<div id="outer"> <div id="inner">Stuff to center</div></div>与：#outer { width: 600px; }#inner { width: 250px; margin: 0 auto; }现在，这不会使文本环绕（就像使用左...
2024-01-10CSS垂直对齐浮动div
我有一个div（#wrapper），其中包含2个并排站立的div。我希望将右div垂直对齐。我在主包装器上尝试了vertical-align：middle，但是它不起作用。它让我发疯！希望有人能帮忙。HTML：<div id="wrapper"> <div id="left-div"> <ul> <li>One</li> <li>Two</li> </ul> </div> <div id="right-div"> Here some text... </di...
2024-01-10如何在动态高度div中垂直居中放置文本？
Text无论div元素有多高，我如何在h1标签内垂直居中放置h1标签？即如果用户更改他的浏览器高度，我希望h1根据新的高度在中心垂直对齐。谢谢。回答：我遇到过的最好的解决方案是利用display属性并将wrapper元素设置为，table以允许vertical-align:middle对元素的使用居中：<body> <div> <h1>Text</h1> ...
2024-01-10在100％高度的div中垂直居中放置文字？
我正在使用的div是父div高度的100％。div仅包含一行文本。div不能具有固定的高度。所以我的问题是。如何垂直对齐文本行？我试过使用：display: table-cell; line-height:200%;如果很重要，则div是绝对定位的。 .requests { position: absolute; right: 0; height: 100%; width: 50px; padding: 0 10px; background-co...
2024-01-10使用CSS使div垂直滚动
这个<div id="" style="overflow:scroll; height:400px;">提供了一个div用户可以水平和垂直滚动的功能。如何更改它以便div 仅 可垂直滚动？回答：除了使用错误的属性外，还可以解决它。滚动条可与任何财产被触发overflow，overflow-x或者overflow-y每个人都可以被设置为任意的visible，hidden，scroll，auto，或inherit。您当...
2024-01-10CSS水平居中固定div？
#menu { position: fixed; width: 800px; background: rgb(255, 255, 255); /* The Fallback */ background: rgba(255, 255, 255, 0.8); margin-top: 30px;}我知道这个问题存在一百万次，但是我找不到解决方案。我有一个div，它应该固定在屏幕上，即使滚动页面，它也应该始终保持在屏幕中间！对于所有浏览器尺寸，div应该具...
2024-01-10如何在div中居中SVG？
我有一个要在div中居中的SVG。div的宽度为900px。SVG的宽度为400像素。SVG的margin-left和margin-right设置为auto。不起作用，它的作用就像是左边距为0（默认值）。有人知道我的错误吗？回答：SVG默认为内联。添加display: block到它，然后margin: auto将按预期工作。...
2024-01-10如何在div中将按钮居中？
我有一个宽度为100％的div。我想将按钮居中放置，该怎么办？<div style="width:100%; height:100%; border: 1px solid"> <button type="button">hello</button></div>回答：由于我注意到这是一个积极的答案，所以进行了更新，但是Flexbox现在是正确的方法。垂直和水平对齐。#wrapper { display: flex; align-items: center; justify-...
2024-01-10使用CSS使div可垂直滚动
这个<div id="" style="overflow:scroll; height:400px;">给出了一个div用户可以水平和垂直滚动的功能。如何更改它以便div 仅 可垂直滚动？回答：除了使用错误的属性外，还可以解决它。滚动条可与任何财产被触发overflow，overflow-x或者overflow-y每个人都可以被设置为任意的visible，hidden，scroll，auto，或inherit。您目...
2024-01-10如何将表格水平和垂直放置在div的中心
我们可以将图片设置为<div>like的背景图片：<style> #test { background-image: url(./images/grad.gif); background-repeat: no-repeat; background-position: center center; width:80%; margin-left:10%; height:200px; backgroun...
2024-01-10div块内的CSS中心文本（水平和垂直）
我有一个div设置为display:block（90px height和width），我有一些文字里。我需要文本在垂直和水平方向的中心对齐。我已经尝试过了text-align:center，但是它没有做水平部分，所以我尝试了vertical-align:middle，但是没有用。有任何想法吗？回答：如果是一行文本和/或图像，则很容易做到。只需使用：text-align:...
2024-01-10
如何实现元素的垂直居中
最近在写项目时,遇到图片和文字垂直居中的问题,所以总结了一下,分享给大家一、利用vertical-align:middle实现垂直居中 (1).图片和文字垂直居中 类似： 代码： <div class="box"> <img src="images/1.jpg" height="71" width="236" alt="" /> <p>文字文字文字文字文字文字</p> ...
2024-01-10如何将浮动div垂直对齐到底部？
如何使条形图的底部而不是顶部？现在它们粘在容器（#bars）的顶部，但我希望它们粘在底部。如您所见，我不知道最高条的高度，所以我也不知道容器的高度。应该简单吧？如果有帮助，它只能在不错的浏览器中工作。PS。条的数量是可变的（在示例中不是），其高度是可变的。只有它们的宽度是静...
2024-01-10如何将元素水平和垂直居中
我试图将标签内容垂直居中，但是当我添加CSS样式时display:inline-flex，水平文本对齐会消失。如何为我的每个标签使文本对齐x和y？* { box-sizing: border-box; }#leftFrame { background-color: green; position: absolute; left: 0; right: 60%; top: 0; bottom: 0;}#leftFrame #tabs { background-color: red; positi...
2024-01-10如何将<div>水平居中
如何使用CSS <div>在另一个文件中水平居中<div>？<div id="outer"> <div id="inner">Foo foo</div></div>回答：您可以将此CSS应用于内部<div>：#inner { width: 50%; margin: 0 auto;}当然，您不必将设置width为50%。任何小于包含宽度的宽度<div>都可以使用。margin: 0 auto是什么呢实际定心。如果您以Internet Explorer 8（及更高...
2024-01-10
