2016-02-29 57 views
0

This is the what the codes I already have looks like, but I want to set it to an exact width so everything looks neat.更改eBay頁面寬度的HTML代碼是什麼?

我對HTML不太好,希望有人能告訴我該放哪裏。下面是我的代碼:

<p align="center"> 
 
<span style="color:#000080;"><span style="font-size:48px;"><span style="font-family:times new roman,times,serif;">Product Information</span></span></span></p> 
 
<div> 
 
<h2> 
 
<span style="color:#000080;"><big><u><span style="background-color:#66ccff;">Description &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span></u></big></span></h2> 
 
</div> 
 
<ul> 
 
<li> 
 
<span style="font-size:18px;">This is a 2016 Peyton Manning #18 Jersey.</span></li> 
 
<li> 
 
<span style="font-size:18px;">Team: Denver Broncos</span></li> 
 
<li> 
 
<span style="font-size:18px;">Player: Peyton Manning</span></li> 
 
<li> 
 
<span style="font-size:18px;">Color: Orange</span></li> 
 
<li> 
 
<span style="font-size:18px;">Brand: Nike</span></li> 
 
<li> 
 
<span style="font-size:18px;">This is a used item that has <u>NO</u> defects. No rips, tears, or stains.</span></li> 
 
</ul> 
 
<div> 
 
<div> 
 
<h2> 
 
<span style="color: rgb(0, 0, 128);"><big><u><span style="background-color: rgb(102, 204, 255);">Size &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;</span></u></big></span></h2> 
 
</div> 
 
<ul> 
 
<li> 
 
This is a Large/44 Jersey. These are the measurements:</li> 
 
</ul> 
 
</div> 
 
<p align="center"> 
 
<img height="230" src="file:///C:/Users/JONATH~1.TOW/AppData/Local/Temp/msohtmlclip1/01/clip_image001.jpg" width="219"><img height="225" src="file:///C:/Users/JONATH~1.TOW/AppData/Local/Temp/msohtmlclip1/01/clip_image002.jpg" width="225"></p> 
 
<table align="center" border="0" cellpadding="0" cellspacing="0" style="width:276px;" width="276"> 
 
<tbody> 
 
<tr> 
 
<td colspan="4" nowrap="nowrap" style="width:276px;height:20px;"> 
 
<p align="center"> 
 
Measurement Chart</p> 
 
</td> 
 
</tr> 
 
<tr> 
 
<td nowrap="nowrap" style="width:63px;height:20px;"> 
 
<p> 
 
<strong>Country</strong></p> 
 
</td> 
 
<td nowrap="nowrap" style="width:75px;height:20px;"> 
 
<p> 
 
Length</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:66px;height:20px;"> 
 
<p> 
 
Width</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:72px;height:20px;"> 
 
<p> 
 
Sleeves</p> 
 
</td> 
 
</tr> 
 
<tr> 
 
<td nowrap="nowrap" style="width:63px;height:20px;"> 
 
<p> 
 
<strong>U.S.</strong></p> 
 
</td> 
 
<td nowrap="nowrap" style="width:75px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:66px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:72px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
</tr> 
 
<tr> 
 
<td nowrap="nowrap" style="width:63px;height:20px;"> 
 
<p> 
 
<strong>Europe</strong></p> 
 
</td> 
 
<td nowrap="nowrap" style="width:75px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:66px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:72px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
</tr> 
 
</tbody> 
 
</table> 
 
<div style="clear:both;"> 
 
&nbsp;</div> 
 
<p> 
 
&nbsp;</p> 
 
<p align="center"> 
 
<span style="font-family:arial,helvetica,sans-serif;"><span style="font-size:18px;">If you want further details on the sizing, please feel free to message us!</span></span></p> 
 
<div> 
 
<div> 
 
<h2> 
 
<span style="color: rgb(0, 0, 128);"><big><u><span style="background-color: rgb(102, 204, 255);">Shipping &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;</span></u></big></span></h2> 
 
</div> 
 
<ul> 
 
</ul> 
 
<p> 
 
<span style="font-size:18px;">This item is shipped using USPS Priority Mail. It is shipped out of St. Paul, MN 55014.</span></p> 
 
</div> 
 
<div> 
 
<br> 
 
<span style="font-size:18px;">We try to ship this package within 24 hour of the time you pay for the item.<br> 
 
We ship Internationally.</span></div> 
 
<p> 
 
<span style="font-size:18px;"><img src="http://thebuttonpost.com/wp-content/uploads/2014/07/priority-mail.png" style="margin-left: 12px; margin-right: 12px; float: right; width: 220px; height: 131px;"></span></p> 
 
<div> 
 
&nbsp;</div> 
 
<p> 
 
<span style="font-size:18px;"><u>The following is included in this shipment:</u></span></p> 
 
<div> 
 
<p> 
 
<span style="font-size:18px;">1.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 2-4 Day Shipping in the US</span></p> 
 
<div> 
 
<p> 
 
<span style="font-size:18px;">2.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Free Tracking</span></p> 
 
<p> 
 
<span style="font-size:18px;">3.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Insurance for your package up to $50.00</span></p> 
 
<div> 
 
&nbsp;</div> 
 
<p> 
 
<span style="font-size:18px;">Please insure that your address is correct. If you are worried your package could be stolen please contact your Post Office with the tracking number and have them hold it there for you. Unfortunately once the tracking shows the package has been delivered to the address it is your responsibility and refunds cannot be accepted.</span></p> 
 
<p> 
 
<span style="font-size:18px;">If your package was damaged by USPS, please contact us ASAP with photos showing the extent of the damage. You will be refunded and we will take care of making an insurance claim with USPS since packaging was our responsibility.</span></p> 
 
<p> 
 
&nbsp;</p> 
 
<div> 
 
<div> 
 
<h2> 
 
<span style="color: rgb(0, 0, 128);"><big><u><span style="background-color: rgb(102, 204, 255);">Return Policy &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</span></u></big></span></h2> 
 
</div> 
 
<p> 
 
<span style="font-size:18px;">We try to make the description of the item you’re buying as detailed as possible to avoid the need for returns. If your item contains a defect that was not listed in the description we will accept a return with photos of the defect. If the item’s defect is clearly not in the photos we posted, or seem to be manufactured, your return will not be accepted.</span></p> 
 
</div> 
 
<div> 
 
<div> 
 
<h2> 
 
<span style="color: rgb(0, 0, 128);"><big><u><span style="background-color: rgb(102, 204, 255);">Payment &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</span></u></big></span></h2> 
 
</div> 
 
<p> 
 
<span style="font-size:18px;">We accept PayPal and Credit/Debit cards. After you click 「Purchase Item」 you are not done checking out! Click on <u>PAY NOW</u>. Your package will not be shipped until you pay for your item, and it will be cancelled if you do not pay within 2 Business Days.</span></p> 
 
</div> 
 
<p align="center"> 
 
&nbsp;</p> 
 
<p align="center"> 
 
&nbsp;</p> 
 
<p style="text-align: center;"> 
 
<img alt="" src="http://www.bceldercare.ca/images/paypal-verified.png" style="width: 500px; height: 146px;"></p> 
 
<p align="center"> 
 
&nbsp;</p> 
 
</div> 
 
</div> 
 
<p> 
 
&nbsp;</p>

+0

嘗試更改'font-sizes' – CodeWalker

+0

@LancePreston我不認爲這就是他要求的 – Abdel

回答

0

如何投入容器的整個頁面,給該容器的你想要多大它是和它爲中心的寬度。在我的片段,我給容器50vw的寬度(它等於當前視口寬度的50%)

#container{ 
 
    width:50vw; 
 
    display:block; 
 
    margin:0 auto; 
 
}
<div id="container"> 
 
<p align="center"> 
 
<span style="color:#000080;"><span style="font-size:48px;"><span style="font-family:times new roman,times,serif;">Product Information</span></span></span></p> 
 
<div> 
 
<h2> 
 
<span style="color:#000080;"><big><u><span style="background-color:#66ccff;">Description &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span></u></big></span></h2> 
 
</div> 
 
<ul> 
 
<li> 
 
<span style="font-size:18px;">This is a 2016 Peyton Manning #18 Jersey.</span></li> 
 
<li> 
 
<span style="font-size:18px;">Team: Denver Broncos</span></li> 
 
<li> 
 
<span style="font-size:18px;">Player: Peyton Manning</span></li> 
 
<li> 
 
<span style="font-size:18px;">Color: Orange</span></li> 
 
<li> 
 
<span style="font-size:18px;">Brand: Nike</span></li> 
 
<li> 
 
<span style="font-size:18px;">This is a used item that has <u>NO</u> defects. No rips, tears, or stains.</span></li> 
 
</ul> 
 
<div> 
 
<div> 
 
<h2> 
 
<span style="color: rgb(0, 0, 128);"><big><u><span style="background-color: rgb(102, 204, 255);">Size &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;</span></u></big></span></h2> 
 
</div> 
 
<ul> 
 
<li> 
 
This is a Large/44 Jersey. These are the measurements:</li> 
 
</ul> 
 
</div> 
 
<p align="center"> 
 
<img height="230" src="file:///C:/Users/JONATH~1.TOW/AppData/Local/Temp/msohtmlclip1/01/clip_image001.jpg" width="219"><img height="225" src="file:///C:/Users/JONATH~1.TOW/AppData/Local/Temp/msohtmlclip1/01/clip_image002.jpg" width="225"></p> 
 
<table align="center" border="0" cellpadding="0" cellspacing="0" style="width:276px;" width="276"> 
 
<tbody> 
 
<tr> 
 
<td colspan="4" nowrap="nowrap" style="width:276px;height:20px;"> 
 
<p align="center"> 
 
Measurement Chart</p> 
 
</td> 
 
</tr> 
 
<tr> 
 
<td nowrap="nowrap" style="width:63px;height:20px;"> 
 
<p> 
 
<strong>Country</strong></p> 
 
</td> 
 
<td nowrap="nowrap" style="width:75px;height:20px;"> 
 
<p> 
 
Length</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:66px;height:20px;"> 
 
<p> 
 
Width</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:72px;height:20px;"> 
 
<p> 
 
Sleeves</p> 
 
</td> 
 
</tr> 
 
<tr> 
 
<td nowrap="nowrap" style="width:63px;height:20px;"> 
 
<p> 
 
<strong>U.S.</strong></p> 
 
</td> 
 
<td nowrap="nowrap" style="width:75px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:66px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:72px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
</tr> 
 
<tr> 
 
<td nowrap="nowrap" style="width:63px;height:20px;"> 
 
<p> 
 
<strong>Europe</strong></p> 
 
</td> 
 
<td nowrap="nowrap" style="width:75px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:66px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
<td nowrap="nowrap" style="width:72px;height:20px;"> 
 
<p> 
 
&nbsp;</p> 
 
</td> 
 
</tr> 
 
</tbody> 
 
</table> 
 
<div style="clear:both;"> 
 
&nbsp;</div> 
 
<p> 
 
&nbsp;</p> 
 
<p align="center"> 
 
<span style="font-family:arial,helvetica,sans-serif;"><span style="font-size:18px;">If you want further details on the sizing, please feel free to message us!</span></span></p> 
 
<div> 
 
<div> 
 
<h2> 
 
<span style="color: rgb(0, 0, 128);"><big><u><span style="background-color: rgb(102, 204, 255);">Shipping &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;</span></u></big></span></h2> 
 
</div> 
 
<ul> 
 
</ul> 
 
<p> 
 
<span style="font-size:18px;">This item is shipped using USPS Priority Mail. It is shipped out of St. Paul, MN 55014.</span></p> 
 
</div> 
 
<div> 
 
<br> 
 
<span style="font-size:18px;">We try to ship this package within 24 hour of the time you pay for the item.<br> 
 
We ship Internationally.</span></div> 
 
<p> 
 
<span style="font-size:18px;"><img src="http://thebuttonpost.com/wp-content/uploads/2014/07/priority-mail.png" style="margin-left: 12px; margin-right: 12px; float: right; width: 220px; height: 131px;"></span></p> 
 
<div> 
 
&nbsp;</div> 
 
<p> 
 
<span style="font-size:18px;"><u>The following is included in this shipment:</u></span></p> 
 
<div> 
 
<p> 
 
<span style="font-size:18px;">1.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 2-4 Day Shipping in the US</span></p> 
 
<div> 
 
<p> 
 
<span style="font-size:18px;">2.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Free Tracking</span></p> 
 
<p> 
 
<span style="font-size:18px;">3.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Insurance for your package up to $50.00</span></p> 
 
<div> 
 
&nbsp;</div> 
 
<p> 
 
<span style="font-size:18px;">Please insure that your address is correct. If you are worried your package could be stolen please contact your Post Office with the tracking number and have them hold it there for you. Unfortunately once the tracking shows the package has been delivered to the address it is your responsibility and refunds cannot be accepted.</span></p> 
 
<p> 
 
<span style="font-size:18px;">If your package was damaged by USPS, please contact us ASAP with photos showing the extent of the damage. You will be refunded and we will take care of making an insurance claim with USPS since packaging was our responsibility.</span></p> 
 
<p> 
 
&nbsp;</p> 
 
<div> 
 
<div> 
 
<h2> 
 
<span style="color: rgb(0, 0, 128);"><big><u><span style="background-color: rgb(102, 204, 255);">Return Policy &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</span></u></big></span></h2> 
 
</div> 
 
<p> 
 
<span style="font-size:18px;">We try to make the description of the item you’re buying as detailed as possible to avoid the need for returns. If your item contains a defect that was not listed in the description we will accept a return with photos of the defect. If the item’s defect is clearly not in the photos we posted, or seem to be manufactured, your return will not be accepted.</span></p> 
 
</div> 
 
<div> 
 
<div> 
 
<h2> 
 
<span style="color: rgb(0, 0, 128);"><big><u><span style="background-color: rgb(102, 204, 255);">Payment &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</span></u></big></span></h2> 
 
</div> 
 
<p> 
 
<span style="font-size:18px;">We accept PayPal and Credit/Debit cards. After you click 「Purchase Item」 you are not done checking out! Click on <u>PAY NOW</u>. Your package will not be shipped until you pay for your item, and it will be cancelled if you do not pay within 2 Business Days.</span></p> 
 
</div> 
 
<p align="center"> 
 
&nbsp;</p> 
 
<p align="center"> 
 
&nbsp;</p> 
 
<p style="text-align: center;"> 
 
<img alt="" src="http://www.bceldercare.ca/images/paypal-verified.png" style="width: 500px; height: 146px;"></p> 
 
<p align="center"> 
 
&nbsp;</p> 
 
</div> 
 
</div> 
 
<p> 
 
&nbsp;</p> 
 
</div>

1

我不會推薦一個固定的寬度。在移動設備上,您的模板不會顯示得很好。我會建議你看看一個簡單的響應式網格CSS佈局,如骨架 - 它將調整它的大小,所有的瀏覽器的寬度,在eBay工作正常!

+0

作爲使用多種設備的長期買方和賣方,我感到有必要在此基礎上支持James。雖然固定寬度會給你一個嚴格的界限,你可以在其中編寫你的列表,但你可能會冒險讓潛在的買家使用較小的顯示器,他們不會爲了閱讀所有內容而反覆滾動來滾動。如果關鍵細節或說明元素超出頁面的右側,並且在投標或購買之前客戶沒有閱讀(或者不知道那裏有任何東西),這對賣家可能是特別危險的。 –