Danke für die schnelle Lösung. Es hat mir viel geholfen.
lg Mirap
Danke für die schnelle Lösung. Es hat mir viel geholfen.
lg Mirap
<!DOCTYPE html>
<html lang="en">
<head>
<title>TicTocTao</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
box-sizing: border-box;
}
body {
font-family: Arial, Helvetica, sans-serif;
}
/* Style the header */
header {
background-color: #666;
padding: 20px;
text-align: center;
font-size: 35px;
color: white;
}
article {
float:center;
padding: 20px;
width: 70%;
background-color: #f1f1f1;
height: 500px; /* only for demonstration, should be removed */
}
/* Clear floats after the columns */
section::after {
content: "";
display: table;
clear: both;
}
/* Style the footer */
footer {
background-color: #777;
padding: 10px;
text-align: center;
color: white;
}
.btn{
width: 95px;
height: 95px;
border: 1px solid dodgerblue;
margin: auto;
border-radius: 4px;
background-color: dodgerblue;
color: white;
font-size: 30px;
cursor: pointer;
}
/* Responsive layout - makes the two columns/boxes stack on top of each other instead of next to each other, on small screens */
@media (max-width: 600px) {
nav, article {
width: 100%;
height: auto;
}
}
</style>
</head>
<body>
<header>
<h2>Tic Tac Tao</h2>
</header>
<section>
<article>
<script>
var rundenzaehler=0;
function schreibe(x){
let inhalt=document
.getElementById("button"+ x)
.getAttribute("value");
if (inhalt=='')
{
if (rundenzaehler%2==0)
{
document
.getElementById("button"+x)
.setAttribute("value","X");
}
else
{
document
.getElementById("button"+x)
.setAttribute("value","O");
}
rundenzaehler=rundenzaehler+1;
}
else
{
alert("Geht nicht!");
}
}
function resett()
{
for (let i=0;i<9;i++)
{
document
.getElementById("button"+i)
.setAttribute("value","");
}
}
for(let i=0;i<9;i=i+1)
{
if (i%3==0) document.write('<p>');
document.write('<input id="button'+i+'"');
document.write(' class="btn"');
document.write(' type="button"');
document.write(' onclick="schreibe('+i+')"');
document.write(' value="" />');
document.write(' ',' ');
if (i%3==2) document.write('</p>');
document.write(' ' );
}
</script>
<input type="button"
class="resetButton"
value="Reset"
onclick="resett()">
</article>
</section>
<footer>
<p>Footer</p>
</footer>
</body>
</html>
Danke für die schnelle Antwort. Ich bin ganz neu hier dewegen habe ich nicht gewusst, wie ich meine frage poste. lg Mirap
Hallo alle! Ich habe TicTacToe programmiert leider habe ich ein Problem wenn ich auf button klicke , die Button bleiben nicht fix wo sie sein sollen. Button habe ich mit for schlrife erstellt. ich habe versucht dieses Problem mit CSS zu lösen habe leider nicht geschaft. für jeder Hilfe bin ich dankbar. Ich sende meine code auch mit. lg
html-seminar.de/woltlab/attachment/2879/
html-seminar.de/woltlab/attachment/2880/
html-seminar.de/woltlab/attachment/2881/
html-seminar.de/woltlab/attachment/2882/
HTML-Seminar.de - mit Videos zum schnellen Lernen, wie man eine Website selbst erstellt.