CSS의 부동 속성 값은 무엇입니까-CSS 튜토리얼-php.cn

CSS의 부동 속성 값은 무엇입니까

王林

풀어 주다： 2023-01-03 09:25:09

원래의

5126명이 탐색했습니다.

CSS의 부동 속성 값은 왼쪽, 오른쪽, 없음, 상속입니다. float 속성은 요소를 왼쪽이나 오른쪽으로 이동할 수 있으며, 주변 요소도 재정렬됩니다. 이미지 레이아웃에 자주 사용됩니다.

CSS의 부동 속성 값은 무엇입니까

이 기사의 운영 환경: windows10 시스템, CSS 3, thinkpad t480 컴퓨터.

Float 속성 소개:

CSS Float(float)는 요소를 왼쪽이나 오른쪽으로 이동하고 주변 요소도 재정렬됩니다. Float는 이미지에 자주 사용되지만 레이아웃에도 매우 유용합니다.

Floating 속성:

clear 요소 주위에 부동 요소가 허용되지 않도록 지정합니다(클리어 부동).

left
right
both
none
inherit

float 상자(요소)가 부동될 수 있는지 여부를 지정합니다.

left
right
none
inherit

예:

<style>
.thumbnail 
{
	float:left;
	width:110px;
	height:90px;
	margin:5px;
}
</style>
</head>

<body>
<h3>图片库</h3>
<p>试着调整窗口,看看当图片没有足够的空间会发生什么。</p>
<img  class="thumbnail" src="/images/klematis_small.jpg"    style="max-width:90%"  style="max-width:90%" alt="CSS의 부동 속성 값은 무엇입니까" >
<img  class="thumbnail" src="/images/klematis2_small.jpg"    style="max-width:90%"  style="max-width:90%" alt="CSS의 부동 속성 값은 무엇입니까" >
<img  class="thumbnail" src="/images/klematis3_small.jpg"    style="max-width:90%"  style="max-width:90%" alt="CSS의 부동 속성 값은 무엇입니까" >
<img  class="thumbnail" src="/images/klematis4_small.jpg"    style="max-width:90%"  style="max-width:90%" alt="CSS의 부동 속성 값은 무엇입니까" >
<img  class="thumbnail" src="/images/klematis_small.jpg"    style="max-width:90%"  style="max-width:90%" alt="CSS의 부동 속성 값은 무엇입니까" >
<img  class="thumbnail" src="/images/klematis2_small.jpg"    style="max-width:90%"  style="max-width:90%" alt="CSS의 부동 속성 값은 무엇입니까" >
<img  class="thumbnail" src="/images/klematis3_small.jpg"    style="max-width:90%"  style="max-width:90%" alt="CSS의 부동 속성 값은 무엇입니까" >
<img  class="thumbnail" src="/images/klematis4_small.jpg"    style="max-width:90%"  style="max-width:90%" alt="CSS의 부동 속성 값은 무엇입니까" >
</body>
</html>

로그인 후 복사

실행 결과:

CSS의 부동 속성 값은 무엇입니까