htmlcss tablelayout: fixed 设置表格单元格等宽,下面小编就来和大家分享一下。
<!DOCTYPE> <html> <head> <meta charset="utf-8" /> <title>设置表格单元格等宽</title> <style type="text/css"> /* 使字体在所有设备上都达到最佳的显示 */ html { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } /* 给body添加阴影 */ body:before { content: ""; position: fixed; top: -10px; left: 0; width: 100%; height: 10px; -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8); -moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8); box-shadow: 0px 0px 10px rgba(0,0,0,.8); z-index: 100; } /* 表格单元格等宽 */ .calendar { table-layout: fixed; } </style> </head> <body> <table width="100%" border="1" class="calendar"> <tr> <td>我在测试我在测试我在测试我在测试我在测试我在测试我在测试我在测试我在测试</td> <td>122222222222222</td> <td>3</td> <td>4</td> <td>5</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr> </table> </body> </html>
【相关推荐】
1. 免费css在线视频教程
2. css在线手册
立即学习“前端免费学习笔记(深入)”;
以上就是分享一个利用css来设置表格单元格等宽的实例代码的详细内容,更多请关注php中文网其它相关文章!
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号