반응형
높이(height)/너비(width)
너비부분에 주로 적용하는 속성.
★ max- : 확대될 수 있는 상한 설정
★ min- : 축소될 수 있는 하한 설정
※ 예) max-with: 100px; -> 100px까지만 확대됨.
max_min_sizing.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>max, min 사이즈</title>
<style type="text/css">
.d1 {
max-width: 600px;
height: 100px;
background-color: skyblue;
}
.d2 {
min-width: 600px;
height: 100px;
background-color: skyblue;
}
</style>
</head>
<body>
<div class='d1'>최대 너비</div><br>
<div class='d2'>최소 너비</div>
</body>
</html>
반응형
'Front-end > Css' 카테고리의 다른 글
[CSS] 링크버튼, 박스그림자(box-shadow) (0) | 2023.07.07 |
---|---|
[CSS] 글자효과(color, text-align, text-decoration..) (0) | 2023.07.07 |
[CSS] 여백(margin, padding) (0) | 2023.07.06 |
[CSS] 테투리(경계선) (0) | 2023.07.06 |
[CSS] 배경 (0) | 2023.07.06 |