하기와같이 코딩시 맨 밑에 띄우기버튼을 누르면 모든 박스가 다 보이도록 하고싶은데
저렇게 코딩하면 에러가 뜹니다 ㅠㅠ 다른방법이 있을까요?
<!DOCTYPE html>
<html>
<head>
<title>Parcel Sandbox</title>
<meta charset="UTF-8" />
<link href="src/styles.css" rel="stylesheet" />
</head>
<body>
<div class="box1 box" id="box1">
<p>box 1</p>
<button onclick="document.getElementById('box1').style.display='none';">
X
</button>
</div>
<div class="box2 box" id="box2">
<p>box 2</p>
<button onclick="document.getElementById('box2').style.display='none';">
X
</button>
</div>
<div class="box3 box" id="box3">
<p>box 3</p>
<button onclick="document.getElementById('box3').style.display='none';">
X
</button>
</div>
<button
onclick="document.getElementsByClassName('box').style.display='flex';"
>
띄우기
</button>
</body>
</html>
-------------------------------------------------------------------------------
body {
font-family: sans-serif;
}
.box1 {
background-color: red;
display: flex;
justify-content: space-between;
}
.box2 {
background-color: blue;
display: flex;
justify-content: space-between;
}
.box3 {
background-color: green;
display: flex;
justify-content: space-between;
}
