减小屏幕尺寸时，是否可以将垂直线更改为水平线？

Question

我想将普通视图中的垂直线更改为移动视图中的水平线。

真的有可能吗？

Answer 1

不确定如何绘制线条，但是可以使用媒体查询来更改线条的外观，具体取决于屏幕尺寸。

当屏幕小于600像素宽时，下面的示例将旋转90度（顺时针）。

.line{
  width: 300px;
  height: 3px;
  background: black;
}

@media only screen and (max-width: 600px) {
  .line{
    transform: rotate(90deg)
  }
}

<div class="line"></div>