목차
这是一个绝对定位了的标题
웹 프론트엔드 프런트엔드 Q&A CSS 위치 지정에 일반적으로 사용되는 스타일은 무엇입니까?

CSS 위치 지정에 일반적으로 사용되는 스타일은 무엇입니까?

Jul 21, 2021 pm 02:50 PM
bottom CSS 위치 지정 left right top

보통 위쪽, 아래쪽, 왼쪽, 오른쪽 스타일과 함께 사용됩니다. top 속성은 요소의 위쪽 가장자리를 지정하고 위치 지정 요소의 위쪽 여백 경계와 포함 블록의 위쪽 경계 사이의 오프셋을 정의합니다. 아래쪽 특성은 요소의 아래쪽 가장자리를 지정합니다. 요소의 오른쪽 속성은 요소의 오른쪽 가장자리를 지정합니다.

CSS 위치 지정에 일반적으로 사용되는 스타일은 무엇입니까?

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

CSS 위치 지정은 일반적으로 위쪽, 아래쪽, 왼쪽 및 오른쪽 스타일과 함께 사용됩니다.

  • top 속성은 요소의 위쪽 가장자리를 지정합니다. 이 속성은 위치가 지정된 요소의 상단 여백 경계와 포함 블록의 상단 경계 사이의 오프셋을 정의합니다.

  • bottom 속성은 요소의 아래쪽 가장자리를 지정합니다. 이 속성은 위치가 지정된 요소의 아래쪽 여백 경계와 포함 블록의 아래쪽 경계 사이의 오프셋을 정의합니다.

  • left 속성은 요소의 왼쪽 가장자리를 지정합니다. 이 속성은 위치가 지정된 요소의 왼쪽 여백 가장자리와 포함 블록의 왼쪽 가장자리 사이의 오프셋을 정의합니다.

  • right 속성은 요소의 오른쪽 가장자리를 지정합니다. 이 속성은 위치가 지정된 요소의 오른쪽 여백 가장자리와 포함 블록의 오른쪽 가장자리 사이의 오프셋을 정의합니다.

참고: "position" 속성의 값이 "static"인 경우 "top", "bottom", "left" 및 "right" 속성을 설정해도 아무런 효과가 없습니다.

예:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style>
h2
{
	position:absolute;
	left:100px;
	top:150px;
}
</style>
</head>

<body>
<h2 id="这是一个绝对定位了的标题">这是一个绝对定位了的标题</h2>
<p>用绝对定位,一个元素可以放在页面上的任何位置。标题下面放置距离左边的页面100 px和距离页面的顶部150 px的元素。.</p>
</body>

</html>
로그인 후 복사

렌더링:

CSS 위치 지정에 일반적으로 사용되는 스타일은 무엇입니까?

(학습 동영상 공유: css 동영상 튜토리얼)

위 내용은 CSS 위치 지정에 일반적으로 사용되는 스타일은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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

핫 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. 에너지 결정과 그들이하는 일 (노란색 크리스탈)
1 몇 달 전 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 최고의 그래픽 설정
1 몇 달 전 By 尊渡假赌尊渡假赌尊渡假赌
Will R.E.P.O. 크로스 플레이가 있습니까?
1 몇 달 전 By 尊渡假赌尊渡假赌尊渡假赌

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

키보드에 어떤 키가 남아 있나요? 키보드에 어떤 키가 남아 있나요? Mar 13, 2023 pm 02:27 PM

왼쪽 키보드는 왼쪽 방향 키이고, 오른쪽 키보드는 기호나 화살표로 대체됩니다. 일부 키보드는 장비를 작동하는 데 사용되는 명령 및 데이터 입력 장치입니다. , 또한 기계 또는 장비를 작동하는 기능 키 세트를 나타냅니다.

Linux top 명령을 사용할 수 없는 경우 수행할 작업 Linux top 명령을 사용할 수 없는 경우 수행할 작업 Mar 08, 2023 am 09:26 AM

Linux top 명령은 시스템에 top 명령이 설치되어 있지 않기 때문에 사용할 수 없습니다. 해결 방법은 "apt-get install procps" 또는 "yum install procps" 명령을 통해 top 명령을 설치하는 것입니다.

CSS의 하단 속성 구문 CSS의 하단 속성 구문 Feb 21, 2024 pm 03:30 PM

CSS의 하단 속성 구문 및 코드 예제 CSS에서 하단 속성은 요소와 컨테이너 하단 사이의 거리를 지정하는 데 사용됩니다. 상위 요소의 아래쪽을 기준으로 요소의 위치를 ​​제어합니다. Bottom 속성의 구문은 다음과 같습니다. element{bottom:value;} 여기서 element는 스타일을 적용할 요소를 나타내고, value는 설정할 아래쪽 값을 나타냅니다. 값은 픽셀과 같은 특정 길이 값일 수 있습니다.

CSS 위치 지정 속성 해석: 위치 및 위쪽/왼쪽/오른쪽/아래쪽 CSS 위치 지정 속성 해석: 위치 및 위쪽/왼쪽/오른쪽/아래쪽 Oct 21, 2023 am 09:58 AM

CSS 위치 지정 속성 해석: 위치 및 위쪽/왼쪽/오른쪽/아래쪽 프런트 엔드 개발에서는 CSS의 위치 지정 속성이 매우 중요합니다. positioning 속성을 사용하면 페이지에서 요소의 위치를 ​​제어할 수 있습니다. 가장 일반적으로 사용되는 위치 지정 속성은 위치이며 그 값은 정적, 상대, 절대 및 고정일 수 있습니다. 이러한 기본 위치 지정 속성 외에도 top, left, r을 사용할 수도 있습니다.

끈끈한 포지셔닝 실패의 이유와 해결책 끈끈한 포지셔닝 실패의 이유와 해결책 Jan 28, 2024 am 08:31 AM

고정 위치 지정이 실패하는 이유는 무엇입니까? 분석 및 솔루션 1. 소개 고정 위치 지정은 스크롤할 때 요소가 페이지의 특정 위치에 "고정"될 수 있도록 하는 일반적인 프런트 엔드 페이지 레이아웃 기술입니다. 이러한 위치 지정 방법은 페이지 상단에 고정되는 탐색 모음, 도구 모음 등의 요소를 구현하기 위해 실제 개발에서 자주 사용됩니다. 그러나 때로는 끈적한 포지셔닝 실패가 발생할 수 있습니다. 이 기사에서는 실패 이유를 분석하고 솔루션을 제공합니다. 2. 끈끈한 위치결정 실패의 원인 분석.

CSS3 속성은 요소의 고정 위치 지정을 어떻게 구현합니까? CSS3 속성은 요소의 고정 위치 지정을 어떻게 구현합니까? Sep 09, 2023 am 10:25 AM

CSS3 속성은 요소의 고정 위치 지정을 어떻게 구현합니까? 웹 개발에서 고정 위치 지정은 부동 또는 상단 탐색 표시줄과 같은 특수 효과를 달성하는 데 자주 사용되는 일반적인 레이아웃 방법입니다. CSS3은 요소의 고정 위치 지정을 달성하는 데 도움이 되는 몇 가지 속성을 제공합니다. 1. 위치 속성 CSS에서 위치 속성은 요소의 위치 지정 방법을 정의하는 데 사용됩니다. 일반적인 값에는 정적, 상대, 절대 및 고정이 포함됩니다. 정적: 기본 위치 지정

CSS의 고정 위치 지정 속성에 대한 지식 포인트는 무엇입니까? CSS의 고정 위치 지정 속성에 대한 지식 포인트는 무엇입니까? Dec 28, 2023 am 08:45 AM

CSS에서 고정 위치 지정의 위치 지정 속성이 무엇인지 이해하십니까? CSS의 위치 지정 속성은 페이지의 요소 위치를 제어할 수 있습니다. 고정 위치 지정은 문서 흐름의 다른 요소가 아닌 브라우저 창을 기준으로 요소를 배치하는 위치 지정 방법입니다. CSS에서 고정 위치 지정에는 position:fixed라는 특수 속성 값이 있습니다. 이 속성 값을 요소에 적용하면 고정된 위치 지정을 얻을 수 있습니다. CSS를 더 잘 이해하는 데 도움이 되는 구체적인 코드 예제는 다음과 같습니다.

CSS에서 요소의 위치를 ​​설정하는 방법 CSS에서 요소의 위치를 ​​설정하는 방법 Feb 18, 2024 pm 07:33 PM

CSS(Cascading Style Sheets)는 웹 페이지의 스타일을 설명하는 데 사용되는 언어입니다. CSS에서는 상대 위치를 설정하여 페이지의 요소 배치를 제어할 수 있습니다. 아래에서는 자세한 코드 예시를 통해 CSS를 사용하여 상대 위치를 설정하는 방법을 소개합니다. 먼저 상대적 위치의 개념을 이해해야 합니다. 상대 위치 지정은 요소가 원래 위치를 기준으로 배치되지만 다른 요소의 위치에는 영향을 미치지 않음을 의미합니다. CSS "positi"를 통한 상대 위치 지정

See all articles