我有一张宽桌子 – 宽阔,不适合屏幕宽度;因此浏览器必须显示滚动条.我希望这张桌子的左右两边有20px的空间;所以我试着用它来设计它(下面的完整代码):
table {
margin-left: 20px;
margin-right: 20px;
text-align: left;
border-collapse: collapse;
background-color: #e0e4f5;
左边距显示为预期:
但右边距不会(有点难以看到 – 但请注意水平滚动条右边缘与桌子右边缘的对齐):
是否有可能获得某种合适的保证金?
这是我的完整测试代码:
margin-left:20px;
保证金权利:20px;
text-align:left;
边界崩溃:崩溃;
background-color:#e0e4f5;
head 1head 2head 3head 4head 5head 6head 7head 8head 9head 10head 11head 12head 13head 14head 15head 16head 17head 18head 19head 20head 21head 22head 23head 24head 25head 26head 27head 28head 29head 30head 31head 32head 33head 34head 35head 36head 37head 38head 39head 40
Table footertest 1test 2test 3test 4test 5test 6test 7test 8test 9test 10test 11test 12test 13test 14test 15test 16test 17test 18test 19test 20test 21test 22test 23test 24test 25test 26test 27test 28test 29test 30test 31test 32test 33test 34test 35test 36test 37test 38test 39test 40test 1test 2test 3test 4test 5test 6test 7test 8test 9test 10test 11test 12test 13test 14test 15test 16test 17test 18test 19test 20test 21test 22test 23test 24test 25test 26test 27test 28test 29test 30test 31test 32test 33test 34test 35test 36test 37test 38test 39test 40test 1test 2test 3test 4test 5test 6test 7test 8test 9test 10test 11test 12test 13test 14test 15test 16test 17test 18test 19test 20test 21test 22test 23test 24test 25test 26test 27test 28test 29test 30test 31test 32test 33test 34test 35test 36test 37test 38test 39test 40test 1test 2test 3test 4test 5test 6test 7test 8test 9test 10test 11test 12test 13test 14test 15test 16test 17test 18test 19test 20test 21test 22test 23test 24test 25test 26test 27test 28test 29test 30test 31test 32test 33test 34test 35test 36test 37test 38test 39test 40
我有一张宽桌子 – 宽阔,不适合屏幕宽度;因此浏览器必须显示滚动条.我希望这张桌子的左右两边有20px的空间;所以我试着用它来设计它(下面的完整代码):table {margin-left: 20px;margin-right: 20px;text-align: left;border-collapse: collapse;background-color: #e0e4f5;}左边距显示为预期:但...
外边距样式属性(margin)
外边距样式属性(margin):设置边框外的距离。
属性:margin-top样式属性,margin-bottom样式属性,margin-left样式属性和margin-right样式属性。
代码
示例:
<!DOCTYPE
html
>
<meta charset="UTF-8">
<title></title>
</head>
上图中是用table标签做的表格,我想做一个鼠标悬浮样式改变的效果时,发现了这些“边距”,后来发现这些间距其实是table默认自带的边框。。。
解决方法如下:
<table border="0" style="border-collapse:collapse;"></table>
只要在tr的css属性中加上border-collapse属性,
背景颜色 background-color:颜色值;
背景图片 background-image:url("图片路径")
背景图片平铺 background-repeat: repeat-x(沿着x轴平铺) | repeat-y(沿着Y轴平铺) | no-repeat(不平铺);