CSS의 위치 속성에 대한 자세한 설명-CSS 튜토리얼-php.cn

CSS의 위치 속성에 대한 자세한 설명

怪我咯

풀어 주다： 2017-06-22 09:16:17

원래의

1947명이 탐색했습니다.

CSS의 position 속성은 요소의 위치 지정 유형을 설정하는 것입니다. 여기에는 절대(absolute positioning), 상대(relative positioning), static(staticpositioning, 기본값), 고정이 포함됩니다. (고정 위치) ) 4개의 매개변수.

정적: 기본값. 위치가 정적으로 설정된 요소는 항상 페이지 흐름에 의해 지정된 위치에 있습니다(정적 요소는 상단, 하단, 왼쪽 또는 오른쪽 선언을 무시합니다).
relative: 위치가 상대로 설정된 요소는 일반 위치를 기준으로 이동할 수 있으므로 "left:20"은 요소를 요소의 일반 위치에서 왼쪽으로 20픽셀 이동합니다.
절대: 위치가 절대로 설정된 요소는 해당 요소를 포함하는 요소를 기준으로 지정된 좌표에 배치될 수 있습니다. 이 요소의 위치는 "left", "top", "right" 및 "bottom" 속성을 통해 지정할 수 있습니다.
fixed: 위치가 고정으로 설정된 요소는 브라우저 창을 기준으로 지정된 좌표에 배치될 수 있습니다. 이 요소의 위치는 "left", "top", "right" 및 "bottom" 속성을 통해 지정할 수 있습니다. 요소는 창이 스크롤되는지 여부에 관계없이 해당 위치에 유지됩니다. IE7(엄격 모드)에서 작동합니다.

예

위치 속성을 사용하여

요소의 위치를 지정합니다. 코드는 다음과 같습니다

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

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

</html>

로그인 후 복사

위 내용은 CSS의 위치 속성에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!