div {margin:10px;}
.ex1 {
width: 500px;
height: 50px;
background-color: powderblue;
}
.ex2 {
width: 70%;
height: 50px;
background-color: #00ff00;
}
.ex3 {
max-width: 500px;
min-width: 300px;
height: 50px;
background-color: pink;
}
<!DOCTYPE html>
<html lang="ko">
<head></head>
<body>
<h1>width | height</h1>
<div class="ex1">이 요소의 높이는 50픽셀 이고 폭은 500픽셀 입니다.</div>
<div class="ex2">이 요소의 높이는 50픽셀 이고 폭은 70퍼센트 입니다.</div>
<div class="ex3">이 요소의 높이는 50픽셀 이고 최대 폭은 500픽셀 이고 최소 폭은 300픽셀 입니다.</div>
</body>
</html>