changeColor.html
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
text-align: center;
}
#wrap {
text-align: center;
}
#color {
width: 300px;
height: 300px;
border: 1px solid black;
margin: 0px auto;
}
#red:checked~div{
background-color:red;
}
#blue:checked~div{
background-color:blue;
}
#green:checked~div{
background-color:green;
}
</style>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
<h1>div색 변경</h1>
<form>
<div id="wrap">
빨강<input type="radio" name="check" id="red">
파랑<input type="radio" name="check" id="blue">
초록<input type="radio" name="check" id="green">
<div id="color"></div>
</div>
</form>
</body>
</html>
'Programming > HTML' 카테고리의 다른 글
글씨체, 폰트, 구글 검색하여 변경 (0) | 2020.02.18 |
---|---|
홈페이지 링크, 메뉴, hover, 안보이다가 마우스 올리면 보이기 (0) | 2020.02.18 |
비디오 보여주기 (0) | 2020.02.18 |
table에서 <a>tag로 사진 불러오기 (0) | 2020.02.18 |
빠른 화면이동 (0) | 2020.02.17 |