css ISO风格按钮和Table 兼容IE

原创于 2014-05-22 20:05:46 发布 · 1k 阅读

0 ·

CC 4.0 BY-SA版权

.Net 专栏收录该内容

7 篇文章

订阅专栏

本文详细介绍了网页样式设计的技巧，包括按钮样式、表格布局、图片展示以及如何在不同浏览器中实现良好的兼容性。特别针对IE8及以下版本提供了优化方案，确保网站在旧版浏览器中也能正常显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

  input {
            border: 1px solid #00bfff;
        }
  .button-style01 {
            color: #00bfff;
            font-weight: bold;
            height: 25px;
            background-color: #ffffff;
            border: 1px solid #00bfff;
            -ms-text-shadow: -2px 0 1px #00bfff;
            /*text-shadow: -2px 0 1px #00bfff;*/
        }

IE8是兼容的，再往下的我就不管了

  .table {
            border-top: 1px solid #87CEFA;
            border-left: 1px solid #87CEFA;
            border-collapse: collapse;
            text-align: center;
        }

            .table th {
                color: #ffffff;
                font-weight: bold;
                line-height: 32px;
                border: 1px solid #00bfff;
                background-color: #00bfff;
                border-right: 1px solid #ffffff;
            }

            .table td {
                line-height: 28px;
                border: 1px solid #00bfff;
            }

            .table tr td:hover {
                background-color: #00bfff;
                color: #ffffff;
                font-weight: bold;
            }

图片截出来可能有点失真。

个别情况IE下有黑边框，给段神器滤镜：

    <!--[if IE]> 
    <style type="text/css">
        input {
            filter: chroma(color=#000000);
        }
    </style>
    <![endif]-->

css ISO风格 按钮和Table 兼容IE

css ISO风格按钮和Table 兼容IE