Untitled


<!DOCTYPE html>
<html>
	<head>
        <meta charset="UTF-8" />
  		<link rel="stylesheet" type="text/css" href="style.css">
 	</head>
 	<body>
        <script>
            function bold()
                {
                    if (document.getElementById("bold").checked){
                        document.getElementById("area").style.fontWeight="bold";
                    }
                    else{
                        document.getElementById("area").style.fontWeight="normal";
                    }
                }
            function italic()
                {
                    if (document.getElementById("italic").checked){
                        document.getElementById("area").style.fontStyle="italic";
                    }
                    else{
                        document.getElementById("area").style.fontStyle="normal";
                    }
                }
            function cent()
                {
                    if (document.getElementById("aleft").checked){
                        document.getElementById("area").style.textAlign="left";
                    }
                    else if(document.getElementById("acent").checked){
                        document.getElementById("area").style.textAlign="center";
                    }
                    else{
                        document.getElementById("area").style.textAlign="right";
                    }
                }
            function fntchg(arg)
                {
                    if (arg=="Courier New"){
                        document.getElementById("area").style.fontFamily="Monospace, Courier New";
                    }
                    else if(arg=="Arial"){
                        document.getElementById("area").style.fontFamily="Sans-serif, Arial";
                    }
                    else{
                        document.getElementById("area").style.fontFamily="Times New Roman, t";
                    }
                }
        </script>
 		<center>
 			<div id="kontener">
  				<div class="kolumna" id="jeden">
  					<table border="1">
					<tr>
						<th colspan="2">
                            <textarea id="area">Tutaj znajduje się testowy tekst</textarea>
						</th>
					</tr>
					<tr>
						<th>
							B
						</th>
						<th>
							<input type="checkbox" id="bold" onclick="bold()">
						</th>
					</tr>
					<tr>
						<th>
							I
						</th>
						<th>
							<input type="checkbox" id="italic" onclick="italic()">
						</th>
					</tr>

                    <tr>
                        <th>
                            Do lewej
                        </th>
                        <th>
                            <input type="radio" id="aleft" name="algin" onclick="cent()">
                        </th>
                    </tr>

                    <tr>
                        <th>
                            Wycentrowane
                        </th>
                        <th>
                            <input type="radio" id="acent" name="algin" onclick="cent()">
                        </th>
                    </tr>

                    <tr>
                        <th>
                            Do prawej
                        </th>
                        <th>
                            <input type="radio" id="aright" name="algin" onclick="cent()">
                        </th>
                    </tr>

                    <tr>
                        <th>
                            Czcionka:
                        </th>
                        <th>
                            <select id="sel" onchange="fntchg(this.value)">
                                <option id="arial">Arial</option>
                                <option id="courier">Courier New</option>
                                <option id="times">Times New Roman</option>
                            </select>
                        </th>
                    </tr>
				</table>
				</div>
   			</div>
		</center>
	</body>
</html>