欢迎光临景诺科技软件开发淘宝店

进店请收藏,谢谢

网页禁用横向滚动条

ps导出的宽1920的表格。要让他居中和兼容所有屏幕浏览器。

我做了如下:

剧中: position:absolute; left:50%; margin-left:-960px; width:1920px

重要的是禁用横向滚动条。因为如果你屏幕变小的时候,虽然你网页居中了,可是你发现下面有一条很长的滚动条。

禁用它(overflow:scroll;overflow-x:hidden)。就OK了

<html>
<head>
<title>视频展示页面 </title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" style="overflow:scroll;overflow-x:hidden" >
<center>
<table id="__01" width="1920" height="984" border="0" cellpadding="0" cellspacing="0" style="position:absolute; left:50%; margin-left:-960px; width:1920px">
	<tr>
		<td>
			<img src="images/video_index_01.jpg" width="471" height="103" alt=""></td>
		<td>
			<img src="images/video_index_02.jpg" width="8" height="103" alt=""></td>
		<td colspan="7">
			<img src="images/video_index_03.jpg" width="947" height="103" alt=""></td>
		<td>
			<img src="images/video_index_04.jpg" width="7" height="103" alt=""></td>
		<td>
			<img src="images/video_index_05.jpg" width="487" height="103" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/video_index_06.jpg" width="471" height="62" alt=""></td>
		<td colspan="2">
			<img src="images/video_index_07.jpg" width="135" height="62" alt=""></td>
		<td>
			<img src="images/video_index_08.jpg" width="9" height="62" alt=""></td>
		<td>
			<img src="images/video_index_09.jpg" width="135" height="62" alt=""></td>
		<td>
			<img src="images/video_index_10.jpg" width="397" height="62" alt=""></td>
		<td>
			<img src="images/video_index_11.jpg" width="135" height="62" alt=""></td>
		<td>
			<img src="images/video_index_12.jpg" width="9" height="62" alt=""></td>
		<td>
			<img src="images/video_index_13.jpg" width="135" height="62" alt=""></td>
		<td>
			<img src="images/video_index_14.jpg" width="7" height="62" alt=""></td>
		<td>
			<img src="images/video_index_15.jpg" width="487" height="62" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/video_index_16.jpg" width="471" height="26" alt=""></td>
		<td>
			<img src="images/video_index_17.jpg" width="8" height="26" alt=""></td>
		<td colspan="7">
			<img src="images/video_index_18.jpg" width="947" height="26" alt=""></td>
		<td>
			<img src="images/video_index_19.jpg" width="7" height="26" alt=""></td>
		<td>
			<img src="images/video_index_20.jpg" width="487" height="26" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/video_index_21.jpg" width="471" height="538" alt=""></td>
		<td colspan="9">
			<img src="images/video_index_22.jpg" width="962" height="538" alt=""></td>
		<td>
			<img src="images/video_index_23.jpg" width="487" height="538" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/video_index_24.jpg" width="471" height="15" alt=""></td>
		<td>
			<img src="images/video_index_25.jpg" width="8" height="15" alt=""></td>
		<td colspan="7">
			<img src="images/video_index_26.jpg" width="947" height="15" alt=""></td>
		<td>
			<img src="images/video_index_27.jpg" width="7" height="15" alt=""></td>
		<td>
			<img src="images/video_index_28.jpg" width="487" height="15" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/video_index_29.jpg" width="471" height="80" alt=""></td>
		<td>
			<img src="images/video_index_30.jpg" width="8" height="80" alt=""></td>
		<td colspan="7">
			<img src="images/video_index_31.jpg" width="947" height="80" alt=""></td>
		<td>
			<img src="images/video_index_32.jpg" width="7" height="80" alt=""></td>
		<td>
			<img src="images/video_index_33.jpg" width="487" height="80" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/video_index_34.jpg" width="471" height="159" alt=""></td>
		<td>
			<img src="images/video_index_35.jpg" width="8" height="159" alt=""></td>
		<td colspan="7">
			<img src="images/video_index_36.jpg" width="947" height="159" alt=""></td>
		<td>
			<img src="images/video_index_37.jpg" width="7" height="159" alt=""></td>
		<td>
			<img src="images/video_index_38.jpg" width="487" height="159" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="471" height="1" alt=""></td>
		<td>
			<img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="8" height="1" alt=""></td>
		<td>
			<img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="127" height="1" alt=""></td>
		<td>
			<img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="9" height="1" alt=""></td>
		<td>
			<img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="135" height="1" alt=""></td>
		<td>
			<img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="397" height="1" alt=""></td>
		<td>
			<img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="135" height="1" alt=""></td>
		<td>
			<img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="9" height="1" alt=""></td>
		<td>
			<img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="135" height="1" alt=""></td>
		<td>
			<img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="7" height="1" alt=""></td>
		<td>
			<img src="images/&#x5206;&#x9694;&#x7b26;.gif" width="487" height="1" alt=""></td>
	</tr>
</table>
</center>
</body>
</html>

代表作品:http://www.mengjiagames.com/support/v/video_index.html

更多

本文固定链接: http://shanmao.me/web/wang-ye-jin-yong-heng-xiang-gun-dong-tiao | 山猫的博客

该日志由 admin 于2013年04月12日发表在 网页前端 分类下, 你可以发表评论,并在保留原文地址及作者的情况下引用到你的网站或博客。
原创文章转载请注明: 网页禁用横向滚动条 | 山猫的博客
关键字: ,