W3Schools Tryit Editor

<!doctype html>
<html>
<title>W3.CSS</title>
<meta name="viewport" content=" initial-scale=1">
<body>
<h2>Code Containers</h2>
<p>The w3-code class create code containers to highlight HTML, JavaScript and CSS code.</p>
<div> 
<h4>HTML Example</h4>
<div>
&lt;!DOCTYPE html&gt;<br>&lt;html&gt;<br>
&lt;title&gt;HTML Tutorial&lt;/title&gt;<br>
&lt;body&gt;<br><br>
&lt;h1&gt;This is a heading&lt;/h1&gt;<br>
&lt;p&gt;This is a paragraph.&lt;/p&gt;<br><br>
&lt;/body&gt;<br>
&lt;/html&gt;
</div>
</div>
<div> 
<h4>CSS Example</h4>
<div>
body {<br>
 background-color: #d0e4fe;<br>}<br><br>
h1 {<br>
 color: orange;<br>
 text-align: center;<br>}<br><br>
p {<br>
 font-family: "Times New Roman";<br>
 font-size: 20px;<br>
}
</div>
</div>
<div> 
<h4>JavaScript Example</h4>
<div>
var x = 5; // assign the value 5 to x<br>
var y = 2; // assign the value 2 to y<br>
var z = x + y; // assign the value
</div>
</div>
</div><div class="naked_ctrl">
<form action="/index.cgi/speech" method="get" name="gate">
<p><a href="http://altstyle.alfasado.net">AltStyle</a> によって変換されたページ <a href="http://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_ref_code_container">(->オリジナル)</a>
/ <label>アドレス: <input type="text" name="naked_post_url" value="http://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_ref_code_container" size="22" /></label> <label>モード: <select name="naked_post_mode">
<option value="default">デフォルト</option>
<option value="speech" selected="selected">音声ブラウザ</option>
<option value="ruby">ルビ付き</option>
<option value="contrast">配色反転</option>
<option value="larger-text">文字拡大</option>
<option value="mobile">モバイル</option>
</select>
<input type="submit" value="表示" />
</p>
</form>
</div>		
</body>
</html>