在Dreamweaver CS6中新建一个html空白文档,将页面内容放入<body></body>中。选中背景图即可插入。
详细步骤:
工具/材料:
1、新建文件夹并将其命名为“表格”。
2、将背景图放入新建的”表格“文件夹里。
3、在Dreamweaver CS6中新建一个html空白文档。
4、将页面内容放入<body></body>中。
5、在<body后按一下空格键,找到background,再按空格,点击“浏览”,找到背景图的位置。
6、选中背景图,点击“确定”。
7、图片插入完成。
8、将这个html另存为在“表格”文件夹里。
9、点击这个预览图标,就可以在浏览器中查看效果。
10、完成效果图。
参考资料:
百度百科-HTML表单
首先,在楼主源代码的基础上解决问题。
在不切图的情况下可以利用CSS的Background属性来解决问题。
但建议楼主的那一幅背景图片顶上的透明要先去掉。以便于标题有更多的空间显示。
<!DOCTYPE html><html>
<head>
</head>
<body>
<table width="753" border="0" height="1150" align="center">
<tr><td colspan="3" class="title"></td></tr>
<tr>
<td width="65" class="left"></td>
<td valign="top" class="content">
主要内容
</td><td width="37"></td>
</tr>
<tr>
<td class="b1"></td>
<td height="100" align="left" valign="top" class="b2">下面的按钮</td>
<td></td>
</tr>
</table>
<style type="text/css">
/*第一段TR,标题使用,只显示至80像素之前的背景*/
.title{
height:80px
background-image:url("http://wz14.cn/images/tablebg.png")
background-repeat: no-repeat/*背景不重复*/
}
/*第二段TR将显示完整的背景*/
.content{
background-image:url("http://wz14.cn/images/tablebg.png")
background-position:-65px -80px/*显示顶部80px后左侧65px后的背景,即没有圆孔部分的背景*/
background-repeat: repeat-y
}
.left{
background-image:url("http://wz14.cn/images/tablebg.png")
background-position:0 -80px/*显示圆孔部分的背景*/
background-repeat: repeat-y
}
/*第三段TR后将重复白色部分的背景*/
.b1{
background-image:url("http://wz14.cn/images/tablebg.png")
background-position:0px -450px
background-repeat: repeat-y
}
.b2{
background-image:url("http://wz14.cn/images/tablebg.png")
background-position:-65px -450px
background-repeat: repeat-y
}
table{
border-collapse:collapse
border-spacing:0
}
th,td{
padding:0
}
</style>
</body>
</html>
最后,不过就个人建议,此类背景问题应该善用DIV+CSS,在Table中解决是非常麻烦的事情。
因为需要在每一个TD上都加上相对应的Class。
而如果采用DIV,可以节省非常多不必要的麻烦。
HTML表格的背景色怎么插入啊可以这样解决:
1、首先要在hbuilder页面进行编辑 *** 作。
2、添加颜色。
3、然后设置bgcolor。
4、然后设置合适的自己需要的颜色。
5、背景颜色就添加完成了。
这样就解决了问题。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)