css3 - border-radius兼容性问题
PHP中文网
PHP中文网 2017-04-17 11:19:53
[CSS3讨论组]

想设置table的四个角是圆弧状,但是下边的两个角在火狐中无法显示出来。在谷歌中可以正常显示

table上部分的代码:`<thead>

                    <th class="col1 header radius_t">table header</th>
                    <th class="col2 header">th2</th>
                    <th class="col3 header radius_r">th3</th>
                </thead>`

table下边的代码:

<tr class="dan rad_bot">
                            <td class="col1 radius_l">row seven</td>
                            <td class="col2">val</td>
                            <td class="col3 radius_b">val</td>
                        </tr>
#r5 .radius_t{
    border-radius: 5px 0 0 0;
}

#r5 .radius_r{
    border-radius: 0 5px 0 0;
}

#r5 .radius_b{
    -moz-border-radius-bottomright: 5px;
}

#r5 .radius_l{
    -moz-border-bottom-left-radius: 5px;
}

PHP中文网
PHP中文网

认证高级PHP讲师

全部回复(1)
高洛峰

首先有个建议 thead 里面套了tr别忘记
其次:写法是这样的顺序 你看下是不是写错了
border-top-left-radius: 2em 0.5em;
border-top-right-radius: 1em 3em;
border-bottom-right-radius: 4em 0.5em;
border-bottom-left-radius: 1em 3em;

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号