标签: vertical-alignment
将Javascript输出垂直对齐设置为中间？
我有一个Javascript时钟显示在一个瘦框架中:
<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE>Untitled</TITLE>
<SCRIPT>
function checkTime(i) {
if (i < 10) {
i = "0" + i;
}
return i;
}
function startTime() {
var today = new Date();
var h = today.getHours();
var m = today.getMinutes();
var s = today.getSeconds();
// add a zero in front of numbers<10
m = checkTime(m);
s = checkTime(s);
document.getElementById('time').innerHTML = h + ":" + m + ":" + s;
t = setTimeout(function () {
startTime()
}, 500);
}
</SCRIPT>
</HEAD> …0
推荐指数
推荐指数
1
解决办法
解决办法
701
查看次数
查看次数
是否可以使用CSS垂直显示表格行？
我有这样一张桌子:
<table>
<thead>
<tr>
<th>Name</th>
<th>Phone no.</th>
<th>Address</th>
<th>Wealth</th>
</tr>
</thead>
<tbody>
<tr>
<th>John Doe</th>
<td>00123456789</td>
<td>Morgue St. 21</td>
<td>$100,000</td>
</tr><tr>
<th>Mary Sue</th>
<td>00987654321</td>
<td>Impossible St. 12</td>
<td>$999,999,999,999,999</td>
</tr><tr>
<th>Cpt. Kirk</th>
<td>00999999999</td>
<td>Enterprise St. 22</td>
<td>$100,000,000</td>
</tr>
</tbody>
</table>嗯,这张桌很宽.现在我必须制作一个样式表,使网站适合在狭窄的屏幕上观看,如手机.所以我必须做这个宽桌子.
我在想这张桌子是否可以垂直显示,而不是水平显示.更具体地说,我在想它是否可以显示更像这样:
<ul>
<li><strong>John Doe:</strong>
<ul>
<li><em>Phone no.:</em> 00123456789</li>
<li><em>Address:</em> Morgue St. 21</li>
<li><em>Wealth:</em> $100,000</li>
</ul>
</li><li><strong>Mary Sue:</strong>
<ul>
<li><em>Phone no.:</em> 00987654321</li>
<li><em>Address:</em> Impossible St. 12</li>
<li><em>Wealth:</em> $999,999,999,999,999</li>
</ul>
</li><li><strong>Cpt. Kirk:</strong>
<ul>
<li><em>Phone no.:</em> 00999999999</li>
<li><em>Address:</em> Enterprise St. 22</li>
<li><em>Wealth:</em> $100,000,000 …0
推荐指数
推荐指数
2
解决办法
解决办法
2454
查看次数
查看次数
垂直对齐表格单元格中的文本
我很难在各自的表格单元格中垂直对齐此定价表的“团队”“业务”等 H4 标题。
该表相当简单，没有应用太多样式，所以我不确定我在这里做错了什么。我尝试将文本包装在 div 中并将父 div 的宽度和高度设置为 100%。它不起作用。
这是我工作的实践网站的链接： https ://netterrain-new-features-clone.mystagingwebsite.com/network-documentation-pricing/
0
推荐指数
推荐指数
1
解决办法
解决办法
1万
查看次数
查看次数
列底部的布尔玛对齐按钮
所以我很难对齐布尔玛专栏底部的按钮。
我希望按钮“购买”位于右栏的底部（与按钮“你好”并排）。我处于这种情况是因为我的其他专栏内容更长。
到目前为止，我在按钮上尝试了这些 CSS 样式（但没有一个对我有帮助）：
vertical-align: bottom;
margin-bottom: auto;
position: absolute;
bottom: 0;
这是我的 HTML：
<section class="section">
<div class="columns is-centered">
<div class="column is-one-fifth">
<h4 class="title is-4">I'm a big column</h4>
I'm taller than the column next to me so my column will be bigger, lorem ipsum lorem ipsum lorem ipsum lorem ipsum
<h6 class="sub">"lorem ipsum"</h6>
<button class="button is-fullwidth">Hello</button>
</div>
<div class="column is-one-fifth">
<h4 class="title is-4">I'm a small column</h4>
I'm a small column, and my button missplaced
<h6 class="sub">"lorem ipsum"</h6>
<button class="button …0
推荐指数
推荐指数
1
解决办法
解决办法
4483
查看次数
查看次数
为什么从 div 中删除文本会导致此布局中断
我已经从 9 日删除了文本div并得到了意想不到的结果。当我从其他divs 中删除文本时也会发生同样的情况。我认为问题出在display: inline-block.
这是我的问题的 HTML 和 CSS 示例：
.relative {
position: relative;
width: 80px;
height: 80px;
background: red;
display: inline-block;
}<div class="relative">1</div>
<div class="relative">2</div>
<div class="relative">3</div>
<div class="relative">4</div>
<div class="relative">5</div>
<div class="relative">6</div>
<div class="relative">7</div>
<div class="relative">8</div>
<div class="relative"></div>
<div class="relative">10</div>0
推荐指数
推荐指数
1
解决办法
解决办法
40
查看次数
查看次数
-1
推荐指数
推荐指数
2
解决办法
解决办法
1万
查看次数
查看次数