문제

본문 첫문단의 첫글자 내어쓰기를 구현하려고 합니다.제가 막히는 부분은 첫 글자와 단락의 나머지 부분 사이에 일정한 간격을 두는 것입니다.

예를 들어, "W"와 "I" 사이의 간격에는 큰 차이가 있습니다.

'I' Outdent
'W' Outdent

차이점을 완화하는 방법에 대한 아이디어가 있는 사람이 있습니까?나는 순수한 CSS 솔루션을 선호하지만 필요한 경우 JavaScript를 사용할 것입니다.

추신:IE나 Opera에서 반드시 호환성이 필요한 것은 아닙니다.

도움이 되었습니까?

해결책

이것을 적용하십시오 p.outdent:first-letter:

margin-left: -800px;
padding-right: 460px;
float: right;

이렇게 하면 첫 번째 문자가 단락의 오른쪽 가장자리에 배치된 다음 단락 너비만큼 왼쪽으로 이동한 다음 문자와 모든 패딩을 플로트의 큰 음수 여백으로 이동하여 단락이 여백을 두고 감싸려고 하지 않습니다.

다른 팁

나는 'courier new'와 같은 고정 너비 글꼴을 사용해 보았지만 문자의 너비가 거의 같기 때문에 눈에 띄지 않게 되었습니다.

편집 - 이 글꼴은 괜찮지만 Windows에서만 작동할 수 있습니다.

p.outdent:first-letter {
    font-family: ms mincho;
    font-size: 8em;
    line-height: 1;
    font-weight: normal;
    float: left;
    margin: -0.1em 0 0 -.55em;
    letter-spacing: 0.05em;
}
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top