橘猫敲代码 2023-03-24 17:01 采纳率: 66.9%
浏览 35
已结题

自定义展开行样式问题

img

img


展开行数据添加连接线,有这种组件吗?
右边是设计图,左边是目前样式写的。


.connect:before{
   content: "";
   top: -10px;
   right: auto;
   border-width: 1px;
   border-left: 1px solid #000;
   border-bottom: 1px solid #000;
   width: 1px;
   height: 100%;
   padding-left: 20px;
   position: relative;
}


  • 写回答

1条回答 默认 最新

  • JoseKe 2023-03-26 06:04
    关注
    根据您提供的代码和设计图,我理解您想要在展开行数据中添加连接线。目前您使用了CSS伪元素`:before`来实现这个效果,但是您的代码中存在一些问题。
    首先,您的`content`属性为空,这意味着您的伪元素没有任何内容。如果您想要添加连接线,您需要在`content`属性中添加一些内容,例如一个竖线符号`|`。
    其次,您的`right`属性值为`aut`,这是无效的属性值。如果您想要将连接线放置在展开行数据的右侧,您可以使用`left`属性来控制其位置。
    最后,您需要为伪元素添加一些样式,例如`width`、`height`、`border`等属性,来定义连接线的大小和样式。
    综上所述,您可以尝试使用以下代码来实现展开行数据添加连接线的效果:

    .connect:before {
    content: "|";
    position: absolute;
    top: 0;
    left: 10px;
    width: 1px;
    height: 100%;
    border-left: 1px solid #ccc;
    }

    您可以根据需要调整`left`属性的值来控制连接线的位置,以及调整`border`属性的值来改变连接线的样式。希望这能帮助到您。
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 4月11日
  • 已采纳回答 4月3日
  • 修改了问题 3月24日
  • 创建了问题 3月24日

悬赏问题

  • ¥15 单纯型python实现编译报错
  • ¥15 c++2013读写oracle
  • ¥15 c++ gmssl sm2验签demo
  • ¥15 关于模的完全剩余系(关键词-数学方法)
  • ¥15 有没有人懂这个博图程序怎么写,还要跟SFB连接,真的不会,求帮助
  • ¥15 PVE8.2.7无法成功使用a5000的vGPU,什么原因
  • ¥15 is not in the mmseg::model registry。报错,模型注册表找不到自定义模块。
  • ¥15 安装quartus II18.1时弹出此error,怎么解决?
  • ¥15 keil官网下载psn序列号在哪
  • ¥15 想用adb命令做一个通话软件,播放录音