用 CSS 做一张报纸

报纸的版式其实不复杂：几根横线、两种字号、一个能喘气的行高。

先定线

css

.rule {
  border-top: 3px double #1b1914;
  border-bottom: 1px solid #1b1914;
  height: 6px;
}

双线是报纸的骨头。标题下面一条，栏目之间一条，页脚再来一条，页面立刻就不像卡片了。

css

.headline {
  font-family: "Songti SC", serif;
  font-size: clamp(32px, 5vw, 54px);
  line-height: 1.2;
  letter-spacing: .01em;
}

正文用衬线，行高给到 2；栏目名用等宽字，字号小一点，拉开字距。

版面上的空白不是浪费。头条周围要空，图片周围要空，栏目之间也要空。挤在一起的报纸，读起来像吵架。