实现移动端table border 0.5px问题_表格线0.5px_柚釉的博客-程序员秘密

设置table的border css 为 border：1px solid #cfcfcf;时，在移动端显示时，border-width：2px；不符合UI设计；

使用border：0.5px solid #cfcfcf时，border显示不出来。

1、设置table的border为0；background为#cfcfcf，collapse=“1”，td的background为#fff；结果显示不出来border。

2、使用scale（）来实现，代码如下：

table{
    margin:0 0.4rem;
    border-collapse:collapse;
    position: relative
}
table td {
    padding: 0.347rem 0.72rem;
    position: relative;
}
table:after{
    content: "";
    display: block;
    position: absolute;
    left: 0%;
    top: 0%;
    width: 200%;
    height: 200%;
    border:1px solid #cfcfcf;
    border-left: none;
    border-bottom: none; 
    transform-origin: 0 0 ; 
    transform:scale(0.5); }
table td:after{
    content: ""; 
    display: block; 
    position: absolute; 
    left: 0%; 
    top: 0%; 
    width: 200%; 
    height: 200%; 
    border:1px solid #cfcfcf; 
    border-top: none; 
    border-right: none; 
    transform-origin: 0 0 ; 
    transform:scale(0.5); 
}

实现效果如下图

本文链接：https://blog.csdn.net/weixin_41308566/article/details/79622872

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

microsoftstore连不上网_Microsoft Store登录不了怎么办 Microsoft Store登录不了解决方法..._锐士无双的博客-程序员秘密

win10Microsoft Store登录不了怎么办？Microsoft Store是电脑中的软件商店，但是很多用户在使用时发现自己无法登陆，下面就和小编一起来看看吧！1、打开控制面板，右上角搜索“疑难解答”并点开，点击“硬件和声音”，点击“Windows应用商店应用”，根据提示完成修复;2、重置一下应用商店，按下Windows+R键，“运行”中输入wsreset，确定;3、在任务栏的搜索框中输...

FT232HQ介绍与应用（Verilog实现）_蜕变℡的博客-程序员秘密

FT232HQ介绍与应用（Verilog实现）

js获取div的坐标_Jlins的博客-程序员秘密

html中最常使用的控件就是div了,那么如何获取div的坐标呢?如何方法可以实现.Js代码 /*** * 获取div的坐标 * @param divObj * @returns {{width: number, height: number, left: *, top: Window}} */ com.whuang.hsj.di

猜数字加强版_aryhbxp21200的博客-程序员秘密

'''（多用户）登录（保存用户信息）(随机生成)给定年龄，用户可以猜三次年龄（保存用户每次输入的年龄）年龄猜对，让用户选择两次奖励用户选择两次奖励（选择奖励是概率性的）后可以退出（输出日志）'''from logging_config import load_my_logging_cfg #固定写法logger = load_my_logging_cfg() # 固...

Codeforces Round #780 (Div. 3)简训-程序员秘密

Codeforces Round #780 (Div. 3)简训树状数组，思维，树状数组那个题很好，值得整理

每天一个linux命令（5）：rm 命令_yangxi_001的博客-程序员秘密

昨天学习了创建文件和目录的命令mkdir ，今天学习一下linux中删除文件和目录的命令： rm命令。rm是常用的命令，该命令的功能为删除一个目录中的一个或多个文件或目录，它也可以将某个目录及其下的所有文件及子目录均删除。对于链接文件，只是删除了链接，原有文件均保持不变。rm是一个危险的命令，使用的时候要特别当心，尤其对于新手，否则整个系统就会毁在这个命令（比如在/（根目录）下执行rm * -