CSS 단어 간격과 문자 간격(코드 포함)의 차이점에 대한 심층적인 이해
- yulia원래의
- 2018-09-08 10:45:315723검색
CSS는 "단어"를 일종의 공백 문자로 둘러싸인 공백이 아닌 문자의 문자열로 정의합니다. letter-spacing 속성과 word-spacing 속성은 모두 해당 요소에 공백을 추가하는 데 사용됩니다. 때로는 둘이 혼동되는 경우가 많습니다. 다음으로 CSS의 간격 설정에 대해 이야기하겠습니다.
1. 단어 간격 단어 사이의 간격을 늘리거나 줄입니다(예: 단어 간격)
1. 개체의 단어 사이에 삽입된 공백 수를 검색하거나 설정합니다. 음수 값은 허용됩니다.
2. 기본값은 0으로 설정하는 것과 동일합니다.
3. 음수 값이 허용되므로 글자가 더 간결해집니다.
4. 이 속성을 사용하면 단어가 너무 넓은 문서를 만들 수 있습니다. 띄어쓰기를 사용하므로 주의해서 사용해야 합니다
2. 문자 간격 문자 사이의 간격을 늘리거나 줄입니다(예: 문자 간격)
1. 개체의 텍스트 사이의 간격을 설정합니다. 및 영문자는 설정된 간격으로 구분됩니다. 이 속성은 단어 간격을 제어합니다. 해당 속성 값은 중국어와 영어 모두에 적용됩니다.
2. 기본값은 0으로 설정하는 것과 같습니다.
3. 문자 간격은 텍스트에만 적용되며 그림에는 영향을 주지 않습니다. 한자에서 letter-spacing 속성을 사용하는 것은 한 글자를 기준으로 합니다. 띄어쓰기의 경우 영어는 한 글자로 구분됩니다.
예: 같은 문장에 대해 letter-spacing 속성과 word-spacing 속성을 각각 부여하여 차이점을 알아보세요.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.a1{letter-spacing: 15px;}
.a2{word-spacing: 15px;}
</style>
</head>
<body>
<p class="a1">have a nice day 今天心情怎么样呢？</p>
<p class="a2">have a nice day 今天心情怎么样呢？</p>
</body>
</html>Rendering:
위 내용은 CSS 단어 간격과 문자 간격(코드 포함)의 차이점에 대한 심층적인 이해의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!