<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
input[type]{ /*input[속성명=속성값] */
background-color: olive;
}
input[type=password]{ /*input[속성명=속성값] */
background-color: green;
}
img{
width : 100px;
height : 100px;
border: 2px solid red;
}
img[src $= jpg]{ /* src가 jpg로 끝나는 경우 */
border-color: orange;
}
img[src ^= "../html/images/추노1"]{ /* src가 ~으로 시작하는 경우 */
border-color: blue;
}
img[src ^= "../html/images/추노1"]{ /* src가 ~으로 시작하는 경우 */
border-color: blue;
}
img[src *= daum] { /* daum 이라는 글자를 포함하는 경우 */
border-color: gray;
}
</style>
</head>
<body>
<form>
아이디 : <input type = "text" id = "id"><br>
패스워드 : <input type = "password" id = "pwd"><br>
</form>
<img src = "../html/images/bear.gif">
<img src = "../html/images/bear.gif">
<img src = "../html/images/bear.gif">
<img src = "../html/images/bear.gif">
<img src = "../html/images/추노1.jpg">
<img src = "../html/images/추노2.jpg">
<img src = "../html/images/daum_logo.png">
</body>
</html>
