如题
ul.menu{ display: none; position: absolute; width: 200px; text-align: left; border: 1px solid #000; background-color: #fff; list-style: none; z-index: 9999;}ul.menu table{ vertical-align: top; line-height:18; font-size: 9pt; border-top: 1px solid #000; line-height: 18px; list-style:none; padding-left: 20px; overflow-y: visible; cursor: pointer; border: 0;}ul.menu table tr{ vertical-align: top; font-size: 9pt; border-top: 0px solid #000; list-style:none; padding-left: 2px; padding-top: 0px; background-color: #ADD8E6; cursor: pointer; border: 0;}ul.menu table td{ vertical-align: top; line-height:18; font-size: 9pt; border-top: 0px solid #000; line-height: 18px; list-style:none; padding-left: 2px; padding-top: 0px; background-color: #ADD8E6; overflow-y: visible; cursor: pointer; border: 0;}ul.menu table caption{ font-size: 9pt; background-color: #ADD8E6; border: 0;} 虽然有很多垃圾样式，不过总体看起来没什么问题，你可以尝试给td加个高，看是否是垂直居中
正常来讲vertical-align: top;已经可以控制居上
还有就是table一般在默认样式重置的会做如此设置
table { border-collapse:collapse; }
而border 边框会加在td上
我看着像是因为line-height的设置影响的。
line-height用于设置行内元素的高度，但同时也会使得行内元素的内容上下居中显示。
ul.menu table td{ vertical-align: top; line-height:18; //你这里用了两个line-height是个什么意思啊。 font-size: 9pt; border-top: 0px solid #000; line-height: 18px; //不带单位和带单位的line-height可是天差地别的，注意 list-style:none; padding-left: 2px; padding-top: 0px; background-color: #ADD8E6; overflow-y: visible; cursor: pointer; border: 0;}line-height:18px;
谢了，解决了。前台的人走了，后台兼前台，完全不了解。
最近还得多麻烦各位了
没问题，没问题
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title><style>ul.menu { display: block; position: absolute; width: 200px; text-align: left; border: 1px solid #000; background-color: #fff; list-style: none; z-index: 9999;}ul.menu table { vertical-align: top; line-height: 18; font-size: 9pt; border-top: 1px solid #000; line-height: 18px; list-style: none; padding-left: 20px; overflow-y: visible; cursor: pointer; border: 0;}ul.menu table tr { vertical-align: top; font-size: 9pt; border-top: 0px solid #000; list-style: none; padding-left: 2px; padding-top: 0px; background-color: #ADD8E6; cursor: pointer; border: 0;}ul.menu table td { vertical-align: top; line-height: 18; font-size: 9pt; border-top: 0px solid #000; line-height: 18px; list-style: none; padding-left: 2px; padding-top: 0px; background-color: #ADD8E6; overflow-y: visible; cursor: pointer; border: 0;}ul.menu table caption { font-size: 9pt; background-color: #ADD8E6; border: 0;}</style></head><body> <ul class='menu'> <li> <table border="1"> <caption>1111Monthly savings</caption> <tr> <td>1Monthfffffffff</td> <td>1Savings</td> </tr> <tr> <td>1January</td> <td>1$100</td> </tr> </table> </li> <li> <table border="1"> <caption>2222Monthly savings</caption> <tr> <td>2Month</td> <td>2Savingsffffffff</td> </tr> <tr> <td>2January</td> <td>ffffff2$100</td> </tr> </table> </li> </ul> <script> </script></body></html>
HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
577
收藏
