<html>
<head>
<style>
.image{
display: inline-block;
list-style: none;}
.image img{
width: 100px;}
</style>
</head>
<body>
<h1 id="main-title">
DOM (Document Object Model)
</h1>
<ul>
<li class="image"><img src="1.jpg"></li>
<li class="image"><img src="2.jpg"></li>
<li class="image"><img src="3.jpg"></li>
<ul>
<script>
var solid_line = document.querySelectorAll('.image');
for (var i = 0; i < solid_line.length; i++) {
solid_line[i].style.border = '1px solid red';}
</script>
</body>
</html>
document.querySelectorAll() 통해 선택자 선택 후
for문을 이용하여 '1px solid red';를 지정
(유튜브 1분코딩으로 공부중)