0
A
回答
0
是的,有:http://jsfiddle.net/Pe5Lt/2/
位置标题absolute
LY,relative
LY表,然后把桌上的一些padding-top
和中心标题与margin: Xpx auto;
:
HTML
<table>
<caption>I'm a CAPTION</caption>
<thead>
<tr>
<th>I'm a TH</th>
</tr>
</thead>
<tbody>
<tr>
<td>I'm a TD</td>
</tr>
</tbody>
</table>
CSS
table {
position: relative;
padding-top: 30px;
width: 200px;
border: 1px solid red;
background: rgb(30, 87, 153);
/* Old browsers */
background: -moz-linear-gradient(top, rgba(30, 87, 153, 1) 0%, rgba(41, 137, 216, 1) 66%, rgba(32, 124, 202, 1) 100%, rgba(125, 185, 232, 1) 100%);
/* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(30, 87, 153, 1)), color-stop(66%, rgba(41, 137, 216, 1)), color-stop(100%, rgba(32, 124, 202, 1)), color-stop(100%, rgba(125, 185, 232, 1)));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(30, 87, 153, 1) 0%, rgba(41, 137, 216, 1) 66%, rgba(32, 124, 202, 1) 100%, rgba(125, 185, 232, 1) 100%);
/* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(30, 87, 153, 1) 0%, rgba(41, 137, 216, 1) 66%, rgba(32, 124, 202, 1) 100%, rgba(125, 185, 232, 1) 100%);
/* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(30, 87, 153, 1) 0%, rgba(41, 137, 216, 1) 66%, rgba(32, 124, 202, 1) 100%, rgba(125, 185, 232, 1) 100%);
/* IE10+ */
background: linear-gradient(to bottom, rgba(30, 87, 153, 1) 0%, rgba(41, 137, 216, 1) 66%, rgba(32, 124, 202, 1) 100%, rgba(125, 185, 232, 1) 100%);
/* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e5799', endColorstr='#7db9e8', GradientType=0);
/* IE6-9 */
}
table caption {
color: red;
position: absolute;
top: 0;
width: 100%;
margin: 10px auto;
}
+0
我更新了我的问题,以阐明我的意思是“标题”。如果你可以修改你的小提琴来实现这一点,那将是非常棒的。 –
0
添加显示:块;要解决这个问题
<style>
table{
background-image: -moz-linear-gradient(bottom, rgb(156,155,250) 43%, rgb(255,255,255) 88%);
display:block;
}
<table>
<caption>Test</caption>
<tr>
<td>Col1</td>
<td>Col2</td>
</tr>
</table>
相关问题
- 1. 如何更改背景元素的CSS?
- 2. CSS/Javascript背景样式
- 3. WordPress的CSS包括样式表
- 4. 隐藏透明DIV后面的元素,但不包括背景
- 5. HTML <select>所选选项背景色CSS样式
- 6. 背景图片<img>元素
- 7. CSS表格:更改悬停时的背景,包括替代行
- 8. Div元素像背景一样行动
- 9. jQuery的CSS来更改元素背景,但不是元素:悬停背景
- 10. CSS背景边框样式和位置
- 11. 覆盖背景图像的CSS样式
- 12. JavaScript动态更改CSS背景样式
- 13. 包括表单元素
- 14. CSS:后没有元素背景
- 15. HTML/CSS元素不能被迫背景
- 16. CSS多个固定背景psuedo元素
- 17. 背景图层元素较低(html/css)
- 18. css元素后面的背景图像
- 19. 浮动元素的CSS背景色
- 20. CSS混合背景下面的元素
- 21. 子元素样式CSS
- 22. 为什么<packaging>元素包括
- 23. 使div元素背景对背景图像透明CSS
- 24. 背景在整个表行(包括空的空间在没有TD元素)
- 25. 使用CSS来对背景图像的LI元素进行样式设置
- 26. CSS样式的按钮元素没有显示IE6中的背景图像
- 27. Jquery PrintMe插件CSS样式不包括
- 28. CSS元素边框包括边距
- 29. CSS目标元素,包括体类
- 30. 如何使<main>背景色透明但不包含其内的元素?
我不能找到一种方法来实现,但包裹台成一个div会,使格BG梯度只会解决您的问题 – insanebits
这可能是有益的:HTTP:/ /dense13.com/blog/2008/08/23/styling-table-captions-with-css-fixing-the-width-problem/ –