CSS에서 범위 너비를 설정하는 방법
- 青灯夜游원래의
- 2021-05-13 17:16:189831검색
CSS에서 범위 너비를 설정하는 방법: 먼저 "display:block;" 또는 "display:inline-block;" 스타일을 사용하여 범위 요소를 블록 요소 또는 인라인 블록 요소로 설정한 다음 "너비: 너비"를 사용하세요. value;" "스타일은 범위의 너비를 설정합니다.
이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.
HTML에서 스팬은 다음과 같은 특징을 지닌 인라인 요소입니다.
1. 높이, 줄 높이, 위쪽 및 아래쪽 여백은 변경할 수 없습니다. 너비는 텍스트나 이미지의 너비이며 변경할 수 없습니다.
스팬의 너비와 높이는 일반적으로 변경되지 않는 것을 볼 수 있습니다. 그런데 가끔 스팬 너비를 설정해야 할 경우가 있는데 어떻게 해야 할까요?
해결 방법:
표시 속성을 사용하여 범위 요소를 블록 요소 또는 인라인 블록 요소로 설정한 다음 너비 속성을 사용하여 너비를 설정합니다. 예:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
.inline{
width: 150px;
background-color: palevioletred;
}
.block{
display: block;
width: 150px;
background-color: palevioletred;
}
.inline-block{
display: inline-block;
width: 150px;
background-color: palevioletred;
}
</style>
</head>
<body>
<div>测试文本，<span class="inline">测试文本</span>，<span class="block">测试文本</span>，<span class="inline-block">测试文本</span></div>
</body>
</html>렌더링:
설명: 
1. html , , 의 요소 차단
, ,
- 및
- 는 블록 요소입니다. 인라인 요소는
display:block;을 설정하여 블록 요소로 표시할 수 있습니다. 구문: span{display:block;}블록 수준 요소의 특성:
display:block;显示为块状元素。语法：
span{display:inline-block;}块级元素的特点：
1、每个块状元素都从新的一行开始，并且其后的元素也另起一行（独占一行）；
2、元素的高度、宽度、行高以及顶和底边距都可设置；
3、元素宽度在不设置的情况下，占它本身父容器的100%（和父元素宽度一致）；
2、内联块状元素
内联块状元素（inline-block）就是同时具备内联元素、块状元素的特点，代码
1. 각 블록 요소는 새 줄에서 시작하고 후속 요소도 새 줄에서 시작합니다( 독점적으로) 한 줄에display:inline-block)
2. 요소의 높이, 너비, 줄 높이, 위쪽 및 아래쪽 여백을 설정할 수 있습니다.
3. 요소의 너비를 설정하지 않으면 해당 요소의 100%를 차지합니다. 상위 컨테이너(및 상위 요소의 너비가 동일함)
2. 인라인 블록 요소인라인 블록 요소(inline-block)는 인라인 요소와 블록 요소의 특성을 모두 갖습니다. display:inline- block은 요소를 인라인 블록 요소로 설정하는 것입니다.
🎜구문: 🎜rrreee🎜인라인 블록 요소의 특징: 🎜🎜1. 요소의 높이, 너비, 줄 높이, 위쪽 및 아래쪽 여백을 설정할 수 있습니다. . 🎜🎜(학습 영상 공유: 🎜css 영상 튜토리얼🎜)🎜
위 내용은 CSS에서 범위 너비를 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!