CSS의 부동 속성 값은 무엇입니까
- 王林원래의
- 2021-02-24 16:28:355062검색
CSS의 부동 속성 값은 왼쪽, 오른쪽, 없음, 상속입니다. float 속성은 요소를 왼쪽이나 오른쪽으로 이동할 수 있으며, 주변 요소도 재정렬됩니다. 이미지 레이아웃에 자주 사용됩니다.
이 기사의 운영 환경: 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 튜토리얼
위 내용은 CSS의 부동 속성 값은 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.