0

我有以下两个来自我正在搞乱的网站的代码摘录。我正在尝试对线条进行更改,但我正在努力做到这一点。这个想法是有以下几点:

“Javascript”

4年以上

“HTML”

3年以上

依此类推,但没有在年份和编程语言之间添加行距,换句话说,每种编程语言之间只有行距。我曾想过使用 pre 标签,但这只会让它变得更糟。

编辑:请尝试提供一个不需要 20 个列 div/包装器的解决方案,或者会弄乱列的定位。谢谢!

HTML:

<div class="column" id="column1">
      <h2>Programming Languages</h2>
      Java 4+ yrs <br>
      SQL - 2+ yrs <br>
      JavaScript - 2 yrs <br>
      <h2>Tools</h2>
    </div>
    <div class="column" id="column2">
      Python - 2 yrs <br>
      C# - 1+ yrs <br>
      C++ - 1 yr <br>
    </div>

    <div class="column" id="column3">
      HTML ~ 1 yr <br>
      CSS ~ 1 yr <br>
      Bash ~ 1 yr
    </div>

CSS:

.column{
  position: absolute;
  color: white;
  font-size: 16px;
  line-height: 60px;
}

#column1{
  margin-top: 100px;
  left: 300px;
}

#column2{
  margin-top: 100px;
  left: 600px;
}

#column3{
  margin-top: 100px;
  left: 900px;
}
4

2 回答 2

0

如果我正确理解了您的问题,只需添加您的 css 样式“line-height:How ever long”

于 2021-12-15T04:33:09.757 回答
0

您可以将每种语言和年份放入

并将每种语言和年份包装在 div 中。然后添加具有您想要 div 的值的 css 行高属性。

于 2021-12-15T04:39:31.617 回答