찾다
웹 프론트엔드CSS 튜토리얼CSS에서 p 태그의 자체 간격을 지우는 방법

CSS에서는 "p {padding:0;margin: 0;-webkit-margin-before: 0;-webkit-margin-after: 0;}" 스타일을 p에 설정하여 p 태그 자체를 지울 수 있습니다. 태그.

CSS에서 p 태그의 자체 간격을 지우는 방법

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

HTML에서 각 태그에는 기본 스타일이 있습니다. 예를 들어 p 태그 자체에는 공백이 있습니다.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
p {
border: 1px solid red;
}
</style>
</head>
<body>
<p>hello</p>
<p>hello</p>
</body>
</html>

CSS에서 p 태그의 자체 간격을 지우는 방법

그렇다면 p 태그 자체의 공백을 제거하는 방법은 무엇입니까?

margin 및 padding 속성을 사용하고 해당 값을 0으로 설정할 수 있습니다.

p {
	padding:0;
	margin: 0;
}

이 방법으로 p 태그의 자체 공백을 지울 수 있습니다.

CSS에서 p 태그의 자체 간격을 지우는 방법

그러나 일부 브라우저에서는 그럼에도 불구하고 p는 여전히 상하 여백을 가지고 있습니다.

CSS에서 p 태그의 자체 간격을 지우는 방법

here-webkit-margin-after-webkit-margin-before에는 1rem이 있으므로 둘 다 0

-webkit-margin-before: 0;
-webkit-margin-after: 0;

로 설정하는 것이 가장 좋습니다. (동영상 공유 학습: css 동영상 튜토리얼)

위 내용은 CSS에서 p 태그의 자체 간격을 지우는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
10 톤 위젯10 톤 위젯Apr 15, 2025 am 09:43 AM

최근 컨퍼런스 토크에서 (죄송합니다. 어느 쪽을 잊어 버렸는지), 타사 위젯 형태의 웹 성능 저하의 빠른 예가있었습니다. 예

WebPagetest의 성능 테스트 단일 페이지 응용 프로그램을위한 레시피WebPagetest의 성능 테스트 단일 페이지 응용 프로그램을위한 레시피Apr 15, 2025 am 09:42 AM

WebPagetest는 온라인 도구 및 오픈 소스 프로젝트로 개발자가 웹 사이트의 성능을 감사하는 데 도움이됩니다. 웹 공연 전도자로서

창 크기 조정 중에 애니메이션을 중지하십시오창 크기 조정 중에 애니메이션을 중지하십시오Apr 15, 2025 am 09:40 AM

모든 종류의 요소에 많은 전환과 애니메이션이있는 페이지가 있다고 가정 해보십시오. 창이 크기가 높아지면 그들 중 일부는 트리거됩니다.

하나의 요소를 다른 요소 아래에서 직조합니다하나의 요소를 다른 요소 아래에서 직조합니다Apr 15, 2025 am 09:38 AM

이 게시물에서는 CSS SuperPowers를 사용하여 두 요소가 겹치고 짜는 시각적 효과를 만듭니다. 이 디자인의 주현절이왔다

CSS에 랜덤 숫자가 있습니까?CSS에 랜덤 숫자가 있습니까?Apr 15, 2025 am 09:37 AM

CSS를 사용하면 웹에서 동적 레이아웃과 인터페이스를 만들 수 있지만 언어로서는 정적입니다. 값이 설정되면 변경할 수 없습니다. 아이디어

단락 중간에 플로트 요소단락 중간에 플로트 요소Apr 15, 2025 am 09:36 AM

이미지 (또는 다른 요소)가 시각적으로 텍스트 단락으로 떠 다니고 싶다고 가정 해 봅시다. 하지만 ... 단락의 한가운데서, 옳지 않다

'는 화려하지만 복잡하지 않은 페이지 로더를 만들게하십시오'는 화려하지만 복잡하지 않은 페이지 로더를 만들게하십시오Apr 15, 2025 am 09:33 AM

요즘 사이트에서 로딩 상태를 보는 것이 일반적입니다. 특히 진보적 인 웹 앱과 반응성 사이트가 증가하고 있기 때문입니다. 그것은 한 가지 방법입니다

크로스 플랫폼 앱 개발의 환경크로스 플랫폼 앱 개발의 환경Apr 15, 2025 am 09:29 AM

나는이 것을 잘 추적하지는 않지만 그것을 얻는다. Android 및 iOS 용 기본 앱을 원한다면 오히려 한 번만 작성하면 좋을 것입니다.

See all articles

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

인기 기사

R.E.P.O. 에너지 결정과 그들이하는 일 (노란색 크리스탈)
4 몇 주 전By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 최고의 그래픽 설정
4 몇 주 전By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 아무도들을 수없는 경우 오디오를 수정하는 방법
4 몇 주 전By尊渡假赌尊渡假赌尊渡假赌
WWE 2K25 : Myrise에서 모든 것을 잠금 해제하는 방법
1 몇 달 전By尊渡假赌尊渡假赌尊渡假赌

뜨거운 도구

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

안전한 시험 브라우저

안전한 시험 브라우저

안전한 시험 브라우저는 온라인 시험을 안전하게 치르기 위한 보안 브라우저 환경입니다. 이 소프트웨어는 모든 컴퓨터를 안전한 워크스테이션으로 바꿔줍니다. 이는 모든 유틸리티에 대한 액세스를 제어하고 학생들이 승인되지 않은 리소스를 사용하는 것을 방지합니다.

SublimeText3 Linux 새 버전

SublimeText3 Linux 새 버전

SublimeText3 Linux 최신 버전

맨티스BT

맨티스BT

Mantis는 제품 결함 추적을 돕기 위해 설계된 배포하기 쉬운 웹 기반 결함 추적 도구입니다. PHP, MySQL 및 웹 서버가 필요합니다. 데모 및 호스팅 서비스를 확인해 보세요.

WebStorm Mac 버전

WebStorm Mac 버전

유용한 JavaScript 개발 도구