2

内部にテキストを含む div がline-heightあり、テキストの高さを超えています。これは、テキストの各行の上と下にスペースがあることを意味します。

右側に沿って垂直の境界線があり、その上部をテキストの上部に揃えたい. どういうわけか、テキストを行の先頭に揃える必要があります。

これは可能ですか、誰かが私をここで助けてくれますか?

div{
    border-left: 1px solid black;
    line-height: 30px;
}
<div>Hello</div>

4

1 に答える 1

3

行の高さをいじらずに:

div{
    position: relative;
    font-size: 16px;
    line-height: 24px;
    width: 25px;
    padding: 0px 0px 0px 10px;
}
div:before {
    position: absolute;
    content: '';
    top: 6px;
    left: 0px;
    bottom: 6px;
    width: 0px;
    border-left: 1px solid black;
}

topとの値bottomは等しいはずです(line-height - font-size) / 2が、文字の高さが異なるため、手動で微調整する必要があります。

デモ: http://jsfiddle.net/NcbB7/

于 2013-09-24T13:29:55.363 に答える