Question

处理CSS中的小变化的最佳方法是什么？

比如说我有两个按钮：

.btn-red .btn-blue

我希望每个按钮彼此相邻，但我希望.btn-blue的边距为10像素。

我有很多可以实现的选项：

我可以为.btn-blue元素添加内联样式（但如果符合BEM这样的命名约定，则会出现可维护性和可读性问题。）
我可以创建一个增加10个像素边距的实用程序类（但是我会陷入可能有多个实用程序类的陷阱，如果我想在另一个项目上增加20个像素的边距怎么样？）
我可以扩展.btn-blue并应用一个不同的类（但这会产生与一次性实用程序类相同的问题）
我可以直接在.btn-green类中添加10个像素，但这与单一责任原则相冲突。
我可以定位一个包装类并使用一个后代选择器目标.btn-blue但是我否定了使用像BEM这样的东西的有用性并落入了特殊的世界。

我意识到这些问题相当迂腐，但这是关键问题之一，因为我的CSS文件增长通常会失控。

说我是否有以下内容......

SASS：

.btn {
  padding: 10px  30px;
  font-size: 16px;
  border-radius: 3px;
  border: none;
}

.btn-red,
.btn-blue {
  @extend .btn;
  color: white;
}

.btn-red {
  background: red;
}

.btn-blue {
  background: blue;
}

HTML：

<div class="btn-wrap">
  <button class="btn-red">
    Mr Red
  </button>
  <button class="btn-blue">
    Mr Blue
  </button>
</div>

Answer 1

老实说，我不太确定你想要实现的目标，但是这样的事情会有所帮助吗？

with open('seq.fasta', 'r') as fh:
    result = []
    for line in fh:
        if line.startswith('>'):
            temp = ''
        elif not line.strip():
            result.append(temp)
        else:
            temp = temp + line

    if temp:
        result.append(temp)

    print("\n".join(result))

处理CSS中的小变化？

1 个答案: