如何让表(HTML)充满页面

html-css07

如何让表(HTML)充满页面,第1张

宽度可设置为100%,高度需要JavaScript控制,在ie下预览下面代码弹出小黄条的时候点击允许.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">

<html xmlns="">

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

*{

padding:0

margin:0

}

table tr td{

border:solid 1px red

}

</style>

<script type="text/javascript">

var geometry={}

if(window.innerWidth){

geometry.getViewportWidth=function(){

return window.innerWidth

}

geometry.getViewportHeight=function(){

return window.innerHeight

}

}else if(document.documentElement &&document.documentElement.clientWidth){

geometry.getViewportWidth=function(){

return document.documentElement.clientWidth

}

geometry.getViewportHeight=function(){

return document.documentElement.clientHeight

}

}else if(document.body.clientWidth){

geometry.getViewportWidth=function(){

return document.body.clientWidth

}

geometry.getViewportHeight=function(){

return document.body.clientHeight

}

}

function change(){

document.getElementById('test').style.height=geometry.getViewportHeight()+'px'

}

window.onload=function(){

change()

window.onresize=function(){

change()

}

}

</script>

</head>

<body>

<table width="100%" cellpadding="0" cellspacing="0" id="test">

<tbody>

<tr><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td></tr>

<tr><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td></tr>

<tr><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td></tr>

<tr><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td></tr>

</tbody>

</table>

</body>

</html>

用Dreamweaver软件编辑

一、打开Dreamweaver,然后选中html,出来了一个html标准文档。

二、在<body>标签里添加文件路径,语法如下:

<body background="文件路径">

这时,页面虽然充满了背景,但可以看出背景图片被填充了多次。

三、在<body>里添加样式,代码如下:

style=" background-repeat:no-repeat

background-size:100% 100%

background-attachment: fixed"

你看,背景就充满页面了。

使用此代码:<img border='0' src='/jpg' width='100%' height='100%' style='position: absoluteleft:0pxtop:0pxz-index: -1'>或者background-size:cover。

拓展资料

【HTML】

超文本标记语言,标准通用标记语言下的一个应用。“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。超文本标记语言的结构包括“头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息,“主体”部分提供网页的具体内容。

【由来】

万维网上的一个超媒体文档称之为一个页面(外语:page)。作为一个组织或者个人在万维网上放置开始点的页面称为主页(外语:Homepage)或首页,主页中通常包括有指向其他相关页面或其他节点的指针(超级链接)。

所谓超级链接,就是一种统一资源定位器(Uniform Resource Locator,外语缩写:URL)指针,通过激活(点击)它,可使浏览器方便地获取新的网页。这也是HTML获得广泛应用的最重要的原因之一。

在逻辑上将视为一个整体的一系列页面的有机集合称为网站(Website或Site)。超级文本标记语言(英文缩写:HTML)是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。

网页的本质就是超级文本标记语言,通过结合使用其他的Web技术(如:脚本语言、公共网关接口、组件等),可以创造出功能强大的网页。

因而,超级文本标记语言是万维网(Web)编程的基础,也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。

参考资料:百度百科--HTML