CSS에서 태그 사이의 간격을 조정하는 방법
- WBOY원래의
- 2021-11-15 16:21:149168검색
조정 방법: 1. a 태그에 "margin: 위쪽 여백, 오른쪽 여백, 아래쪽 여백, 왼쪽 여백;" 스타일을 추가합니다. 2. "margin-left: 왼쪽 여백;", "margin-top: top"을 추가합니다. margin;"을 a 태그에; ”, “margin-right:right margin;” 및 기타 스타일은 여백을 다른 방향으로 설정합니다.
이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.
CSS에서 태그 사이의 간격을 조정하는 방법
1. CSS는 여백 속성을 사용하여 태그의 간격을 설정할 수 있습니다. margin-left 속성을 사용하여 개별적으로 설정합니다.
margin 하나의 선언에서 모든 여백 속성을 설정하는 약식 속성입니다. 이 속성은 1~4개의 값을 가질 수 있습니다.
이 단축 속성은 요소의 모든 여백 너비를 설정하거나 각 측면의 여백 너비를 설정합니다.
블록 수준 요소의 수직으로 인접한 여백은 병합되지만 인라인 요소는 실제로 위쪽 및 아래쪽 여백을 차지하지 않습니다. 인라인 요소의 왼쪽 및 오른쪽 여백은 병합되지 않습니다. 마찬가지로, 부동 요소의 여백은 병합되지 않습니다. 음수 여백 값을 지정할 수 있지만 사용할 때는 주의하십시오.
예:
margin:10px 5px 15px 20px;
는 위쪽 여백은 10px, 오른쪽 여백은 5px, 아래쪽 여백은 15px, 왼쪽 여백은 20px을 의미합니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
a{
margin:0px 0px 0px 202px;
}
</style>
<head>
<body>
<a href="#">a标签1</a><a href="#">a标签2</a>
</body>
</html>2 "margin-left: 왼쪽 여백 값;"이라는 표현도 있습니다. 샘플 코드는 다음과 같습니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
a{
margin-left:202px;
}
</style>
<head>
<body>
<a href="#">a标签1</a><a href="#">a标签2</a>
</body>
</html>출력 결과:
위 예에서는 " margin-left:왼쪽 여백 값;" 스타일.
더 많은 프로그래밍 관련 지식을 보려면 프로그래밍 비디오를 방문하세요! !
위 내용은 CSS에서 태그 사이의 간격을 조정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!