카테고리:전체글>자바스크립트

자바스크립트 CSS,스타일시트 제어

<html>
<head>

<style>
.IMGN1{
position:absolute;
left:10%;
top:10%;
}
</style>

</head>
<script>
function aaa() {
document.styleSheets[0].rules[0].style.left=”50%”;
document.styleSheets[0].rules[0].style.top=”50%”;
}

</script>
<body>
<img id=”img_airp” src=”airp.png” class=”IMGN1″>
<div onclick=”aaa()”>
클릭
</div>
</body>
</html>

//첫번째 스타일시트 참조

<style> </style>태그가 하나 있을시

document.styleSheets[0]

//첫번째 스타일시트 첫번째 선택자 참조

document.styleSheets[0].rules[0]

//첫번째 스타일시트 첫번째 선택자의 속성

document.styleSheets[0].rules[0].style

//첫번째 스타일시트 첫번째 선택자의 속성값

document.styleSheets[0].rules[0].style.left=”50%”;