<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1>배경 화면의 설정</h1>
※다음 버튼을 클릭하면 홈페이지의 배경색을 변경할 수 있습니다.<br>
<button type="button" onclick="document.bgColor='red'">빨강</button>
<!-- js 사용 -->
<button type="button" onclick="colorset(1)">녹색</button>
<button type="button" onclick="colorset(2)">청색</button>
<button type="button" onclick="colorset(3)">주황색</button>
<button type="button" onclick="colorset(4)">검정색</button>
<button type="button" onclick="colorset(5)">흰색</button>
<script type="text/javascript">
function colorset( num ) {
if(num == 1){
document.bgColor = "green";
}
if(num == 2){
document.bgColor = "blue";
}
if(num == 3){
document.bgColor = "orange";
}
if(num == 4){
document.bgColor = "black";
}
if(num == 5){
document.bgColor = "white";
}
}
</script>
</body>
</html>
실행결과
'IT > Html + CSS + JS' 카테고리의 다른 글
[Html+JavaScript] 미술관 및 박물관 링크 (0) | 2021.06.07 |
---|---|
[Html+JavaScript] "1일 1개씩 먹으면 의사 필요없다" (0) | 2021.06.07 |
[Html+JavaScript] 계산기 (0) | 2021.06.07 |
[Html] List (0) | 2021.06.03 |
[Html] Tag -1 글자태그 (1) | 2021.06.03 |