h4 {
color: rgb(255, 255, 255);
font-family: Arial, Consolas
text-align: center;
}
textarea {
width: 50%;
float: top;
min-height: 250px;
overflow: scroll;
margin: auto;
display: inline-block;
background: #f4f4f9;
outline: none;
font-family: Consolas;
font-size: 17px;
}
iframe {
bottom: 0;
position: relative;
width: 100%;
height: 35em;
}<html>
<head>
<title>HTML CSS JS Editor v5.0.3</title>
<h4>HTML CSS JS Editor</h4>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" type="image/x-icon" href="C:\Users\Administrator\Pictures\favicon.ico">
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="backround.css" />
</head>
<body>
<textarea id="html" placeholder="HyperText Markup Langauge"></textarea>
<textarea id="css" placeholder="Casading Style Sheets"></textarea>
<textarea id="js" placeholder="JavaScript"></textarea>
<iframe id="code"></iframe>
<!--These are some compile code and a text.-->
<script type="text/javascript" src="app.js"></script>
<p>Hedgesoft HTML CSS JS Editor is a free source HTML CSS JS Editor website that you can create a web, if you want to save, please press enter. Credits to me. Created by me and all codes by VS Code.</p>
</body>
</html>function compile() {
var html = document.getElementById("html");
var css = document.getElementById("css");
var js = document.getElementById("js");
var code = document.getElementById("code").contentWindow.document;
document.body.onkeyup = function() {
code.open();
code.writeln(
html.value +
"<style>" +
css.value +
"</style>" +
"<script>" +
js.value +
"</script>"
);
code.close();
};
}
compile();