0
好家伙,
我刚开始学习HTML和CSS,并决定开始我的第一次学习的项目。我正在尝试重新创建发票模板,与附图上的发票模板完全相同。我遇到的问题是,将表格标题对齐为“船方法,订单日期...”以便像图片一样展开。我已经尝试调整th标签内的宽度并设置像素值,但我卡住了。
感谢您的帮助,伙计们!
这是我迄今编码:
<!DOCTYPE html>
<head>
<link rel="stylesheet" type="text/css"
href="https://fonts.googleapis.com/css?family=Roboto">
<style>
body {
font-family: 'Roboto';
margin: 0;
body: 0;
}
.shipto {
color: #fff;
white-space: pre;
background:#000;
width: 40px;
height: 225px;
position: relative;
left: 400px;
bottom: 30px;
}
.top-box {
color: #fff;
table-layout: fixed;
}
th {
white-space: nowrap;
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<img src="https://c1.staticflickr.com/3/2926/32085237484_4b8c92a6b2_z.jpg" width="300" height="44" alt="Adidas Logo">
<div class="shipto">
<h4>
S
h
i
p
T
o
</h4>
<div class="top-box">
<table border="1" summary="order information" bgcolor="black" cellpadding="15" cellspacing="0">
<tr>
<th>SHIP METHOD</th>
<th>ORDER DATE</th>
<th>ORDER NO.</th>
<th>DELIVERY NO.</th>
<th>PAYMENT TYPE</th>
</tr>
</div>
</body>
感谢您抽出宝贵时间来帮助我。我很感激。 – Ceejay86