방법 - 구문 형광펜 만들기
구문 형광펜을 만들고 사용하는 방법을 알아보세요.
구문 형광펜
다음과 같이 색상을 추가하면 코드 조각을 더 쉽게 읽을 수 있습니다.
<!DOCTYPE html>
<html>
<body>
<h1>Testing an HTML Syntax Highlighter</h2>
<p>Hello world!</p>
<a href="https://www.w3schools.com">Back to School</a>
</body>
</html>
<html>
<body>
<h1>Testing an HTML Syntax Highlighter</h2>
<p>Hello world!</p>
<a href="https://www.w3schools.com">Back to School</a>
</body>
</html>
<!DOCTYPE html >
<html >
<body >
<h1 >HTML 구문 형광펜 테스트 </h2 >
<p >안녕하세요! </p >
<a href ="https://www.w3schools.com"> 학교로 돌아가기 </a >
</body >
</html >
<html >
<body >
<h1 >HTML 구문 형광펜 테스트 </h2 >
<p >안녕하세요! </p >
<a href ="https://www.w3schools.com"> 학교로 돌아가기 </a >
</body >
</html >
구문 형광펜을 만드는 방법
1단계) HTML 추가:
예시
HTML 코드를 포함하는 <div>:
<div id="myDiv">
<!DOCTYPE html><br>
<html><br>
<body><br>
<br>
<h1>Testing an HTML Syntax Highlighter</h2><br>
<p>Hello
world!</p><br>
<a href="https://www.w3schools.com">Back to
School</a><br>
<br>
</body><br>
</html>
</div>
2단계) 자바스크립트 추가:
예시
"w3CodeColor"라는 함수를 만들고 DIV 요소를 매개변수로 사용하여 호출합니다.
w3CodeColor(document.getElementById("myDiv"));
function w3CodeColor(elmnt) {
// click "Try it Yourself" to see the JavaScript...
}