HTML – die besten Beiträge

Hallo liebe Community,

Ich habe eine kleine Test Webseite und probiere mich gerade daran, dass Buttons nach einem Klick die Farbe vom Rand (also "Border") geändert wird. Das habe ich mithilfe von CSS mit dem :focus tag gemacht. Dies funktioniert auch gut, allerdings ist es so, dass wenn ich an irgendeine Stelle (meistens Stellen ohne Inhalt oder Button, also komplett frei) klicke, dass dann die Färbung aufgehoben wird. Das wollte ich allerdings nicht so. Ich wollte das so haben, dass das nur passiert wenn ich die anderen dazugehörigen Buttons klicke (Sonst soll nichts passieren).

Ich habe allerdings noch weitere Buttons. Bedeutet, dass nicht alles beeinflusst werden soll. Das kann man ja mit sicherheit mit ID´s oder Klassen lösen.

Kann mir jemand dabei helfen, mit der Färbung?

Hallo,

Ich will halt einfach zum Spaß eine eigene Website machen hab aber keinen Plan wie ich die auch online aufrufen könnte ?

(p.s: Ich kann HTML)

Ich habe so eine Seite :

<li class="items">
    <p>some text 1</p>
    <div><button class="link" value="1">Wählen</a></div>
</li>
<li class="items">
    <p>some text 2</p>
    <div><button class="link" value="2">Wählen</a></div>
</li>
<li class="items">
    <p>some text 3</p>
    <div><button class="link" value="3">Wählen</a></div>
</li>



<form action="send" method="POST">
    <input type="text" name="text" id="text" required>
    <input type="number" name="zahl" id="zahl">
    <button type="submit" name="submit">Senden</button>
</form>

oben sind mehrere Texte mit je einem Button zum Auswählen (derzeit ohne funktion). Unten ist dann ein Formular und man kann selbst die Zahl des Textes dort eintragen.

Jetzt will ich das aber für leute vereinfachen und ermöglichen, dass man einfach auf den jeweiligen Button klickt und dann die Zahl (das value des Buttons) in das textfeld "number" eingetragen wird. Wie kann ich das mit javascript machen ? außerdem sollte der cursor direkt in das textfeld "text" gehen.

Hallo zusammen im Moment Arbeite ich an einer Homepage wo ich das Problem habe, das ich Texte nicht auf ein Bild billig verschieben kann, wie ich will.

Es hat, mit Position gut funktioniert wurde mir aber leider von meinem Arbeitgeber verwehrt.

Ich probierte es mit Padding, margin aus und z-index aber es Funktionierte dennoch nicht. Also komm ich zu der Frage wisst ihr Vllt welche befehle es noch gibt, wo man Objekte beliebig verschieben kann wie man möchte?

Hallo, ich hatte bisher noch nicht viel mit XML zu tun und muss folgende Aufgabe bearbeiten:

Ziel ist es, eine beliebige XML-Struktur zu erstellen, die über eine interne DTD gegengeprüft wird. Das bedeutet, dass die Struktur auf Wohlgeformtheit und Validierung geprüft werden muss. Es soll ein Bezug zur FHWS bestehen, in der Studierende, Prüfungen und deren Leistungen (Noten) realitätsnah abgebildet werden.

Die Studenten und die Daten, die ich verwendet habe, sind nicht echt, sondern erfunden (sonst wird meine Frage wieder gelöscht)!

Ich habe das jetzt so weit bearbeitet, dass ich ein paar Studierende erfunden und ein paar Daten für diese festgelegt habe. Also Alter, Studiengang, Vertiefung, ....

Das sollte soweit auch passen, da man nur zeigen sollte, dass man sich ein bisschen mit XML auseinandergesetzt hat.

Meine Frage ist jetzt allerdings: Wie lasse ich das durch eine interne DTD gegenprüfen. Muss ich hierfür so etwas wie:

<!DOCTYPE Hochschule [
  <!ELEMENT Hochschule (Student)>
  <!ELEMENT Student (Vorname, Nachname, Alter, Studiengang, Vertiefung)>

verwenden oder wie genau funktioniert das?

Ich freue mich über jede Hilfe.

Vielen Dank!

Hallo, ich versuche seit einer ganzer weile den Highlight effect in js mit Leaflet und kriege es nicht hin.

Kennt sich jmd aus?
Kann ich z.B. auch Polygone einzeln den highlight effect geben ohne sie zu gruppieren?

Habe mega viel gegoogle, verstehe das meiste aber einfach nicht, und selsbt beim copy pasten gehts nicht.
Ich weiß nciht mal wo ich was ändern muss...

wie bekomme ich z.B. hier zu einem highliught effect beim hovern mit der maus

var group = new L.LayerGroup([
  new L.Polygon([
    [-50, -50], [50, -50], [50, -10], [-50, -10]
  ], {'label': 'Polygon 1', 'popup': 'Polygon 1'}),
  new L.Polygon([
    [-50, 10], [50, 10], [50, 50], [-50, 50]
  ], {'label': 'Polygon 2', 'popup': 'Polygon 2'})
]).addTo(map);

wenn ich https://embed.plnkr.co/plunk/LjzFbI hier raus das Beipsiel kopieren funktioniert es bei mir nicht.

Es gibt zu dem Thema in meinen Augen viel zu wenig ausführliche Hilfen.

Ich habe bereits eine Map, und darauf 10 Polygone, die aber auf nichts reagieren.

Hallo alle zusammen,

Ich bin gerade dabei eine Webseite mit Wordpress zu bauen und mein Theme gibt mir eine Inhaltsbreite von max. 1920 Px vor. Leider kann ich den Inhalt nicht über den Theme Customizer breiter machen. Jetzt muss ich das anscheinend über CSS machen. Bin ganze Zeit am rum probieren aber es funzt einfach nicht.

Welchen Code sollte ich am besten verwenden?

LG und Danke im Vorraus

Hey,

das wird fürs erste wahrscheinlich meine letzte frage zu php sein. Und zwar fehlt mir noch die Primzahlbestimmung. Ich hab es schonmal gefragt, jedoch hat es bisher noch nicht funktioniert.

<html>
   	<?php
		$zahl1 = $_POST["zahl1"];
		$zahl2 = $_POST["zahl2"];
		$text = $_POST["text"];
		$produkt = $zahl1*$zahl2;
         $feld=array();

		
		if($zahl1 < $zahl2) {
			echo "Zahlen: $zahl1 und $zahl2 <br>";
        for ($i=$zahl1; $i<=$zahl2;$i++)
		 {$feld[]=$i;}
	 
			foreach($feld as $zahl) {
				
				
				if($zahl % 2 == 0) {
					echo"<font color='red'>{$zahl}</font>";					
				}								
				else {
					echo"<font color='blue'>{$zahl}</font>";
				}
			}
			echo "<br> Produkt: $produkt <br> Zeichenkette: $text  ";
			echo  strlen($text);
		}
		if($zahl2 < $zahl1) {
			echo "Zahlen: $zahl2 und $zahl1 <br>";
		 for ($i=$zahl2; $i<=$zahl1;$i++)
		 {$feld[]=$i;}	
			
			foreach($feld as $zahl) {
				
				
				if($zahl % 2 == 0) {
					echo"<font color='red'>{$zahl}</font>";
				}
				else {
					echo"<font color='blue'>{$zahl}</font>";
				}
			}
			echo "<br> Produkt: $produkt <br> Zeichenkette: $text  ";
			echo  strlen($text);
		}


	?>
</html>

Das ist mein code bisher und es funktioniert auch alles, bis auf die primzahlen. Wäre sehr nett

Mein Ziel ist es, eine To-Do-Liste mit HTML, CSS und Javascript zu erstellen. Eine Person gibt ihr To-Do ein und kann es mit ENTER oder mit dem "Bestätigen"-Button hinzufügen. Gleichzeitig wird auch die Leiste, wo man dies eingibt, wieder geleert.

Wenn man nun dort etwas eingibt und bestätigt, wird die Eingabeleiste geleert, aber das To-Do fügt sich nicht hinzu. Oder besser gesagt: Es erscheint nur für ein paar Millisekunden.

Wie kann ich den Fehler beheben (ich bin Anfänger)?

Hier der Code von der index.html-Datei:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ToDo Liste</title>
    <style>
      #input {
        margin: 50px;
        text-align: center;
      }
    </style>
    <script>
      function addTodo() {
        todolist.innerHTML += `${todofield.value}`;
        todofield.value= '';
      }
    </script>
  </head>
  <body>
    <form onsubmit="addTodo()">
      <div id="input">
        <input type="text" id="todofield">
        <button type="submit" for="todofield">Bestätigen</button>
      </div>
    </form>
    <div id="todolist"></div>
  </body>
</html>

Danke für eure Hilfe.

Hi, will dass das erste Bild direkt angezeigt wird und das der Beispieltext rechts steht. Wegen Zeichen kurz gehalten. Danke!

<div class="mySlides" id="expandedImg">
<img src="bilder/schuh.jpg" style="width:35%">
</div>
<div class="mySlides">
<img src="bilder/schönschuh.jpg" style="width:35%">
</div>
<div class="mySlides">
<img src="bilder/mann.jpg" style="width:35%">
</div>
<div class="mySlides">
<img src="bilder/lederschuh.jpg" style="width:35%">
</div>
<div class="mySlides">
<img src="bilder/basketball.jpg" style="width:35%">
</div>
<div class="caption-container">
<p id="caption"></p>
</div>
<div class="row">
<div class="column">
<img class="demo cursor" src="bilder/schuh.jpg" style="width:90%" onclick="currentSlide(1)" alt=""></div>
<div class="column">
<img class="demo cursor" src="bilder/schönschuh.jpg" style="width:90%" onclick="currentSlide(2)" alt="">
</div>
<div class="column">
<img class="demo cursor" src="bilder/mann.jpg" style="width:90%" onclick="currentSlide(3)" alt="">
</div>
<div class="column">
<img class="demo cursor" src="bilder/lederschuh.jpg" style="width:90%" onclick="currentSlide(4)" alt="">
</div>
<div class="column">
<img class="demo cursor" src="bilder/basketball.jpg" style="width:90%" onclick="currentSlide(5)" alt="">
</div>
</div>
</div> 
<div class="text">
<a>Beispieltext</a>
<p>Beispieltext...</p>
</div>
* {box-sizing: border-box;}
.container {
position: relative;
margin-top: 80px;
}
.mySlides {
display: none;
margin-bottom: -45px;
margin-top: 65px;
margin-left: 10px;}
.cursor {cursor: pointer;}
.prev,
.next {
cursor: pointer;
position: absolute;
top: 300px;
width: auto;
padding: 16px;
color: rgb(0, 0, 0);
font-weight: bold;
font-size: 20px;
border-radius: 0 3px 3px 0;
user-select: none;
-webkit-user-select: none;}
.next {
right: 0;border-radius: 3px 0 0 3px;} 
.prev:hover,
.next:hover {background-color: rgba(211, 211, 211, 0.8);}
.caption-container {text-align: center; background-color: rgb(255, 255, 255);color: white;}
.row:after {content: ""; display: table; clear: both;}
.column {float: left; width: 7%;}    
.demo {opacity: 0.6;}
.active,
.demo:hover {opacity: 1;}
.row {margin-top: 65px; margin-left: 10px;}
.text {display: flex; justify-content: flex-end; width: 40%;}
var slideIndex = 1;
showSlides(slideIndex);

function plusSlides(n) {
showSlides(slideIndex += n);
}

function currentSlide(n) {
showSlides(slideIndex = n);}

function showSlides(n) {
var i;
var slides = document.getElementsByClassName("mySlides");
var dots = document.getElementsByClassName("demo");
var captionText = document.getElementById("caption");
if (n > slides.length) {slideIndex = 1}
if (n < 1) {slideIndex = slides.length}
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";}
for (i = 0; i < dots.length; i++) {
dots[i].className = dots[i].className.replace(" active", "");}
slides[slideIndex-1].style.display = "block";
dots[slideIndex-1].className += " active";
captionText.innerHTML = dots[slideIndex-1].alt;}

Hey.

Ich soll ein HTML und PHP Skript schreiben, mit welchem man eine CSV-Datei hochladen kann. Das Skript soll eine MySQL Datenbank (auf XAMPP bzw. PhpMyAdmin) leeren und dann die Datei einfügen.

Danke für jede Hilfe und Antwort :)

Hallo, mein Problem ist, dass wenn ich das Browserfenster verkleinere die Div über den Rand geht. Perfekte Lösung wäre, wenn der Text dann unter dem Bild erscheint, sobald er zu klein für das Fenster ist. Code:

                <div id="produkte">
                    <figure class="produkt">
                        <a href="#schuh">
                            <div class="bild">
                              <img src="bilder/schuh.jpg" alt="Schuh"></div>
                            
                            <figcaption class="beschreibung">
                            <strong>Nike Air - 790€</strong>
                            <p>Toller Schuh mit dicker Sohle und guter Federung, wird meistens als Lauf- bzw. Freizeitschuh verwendet.</p>
                            </figcaption>
                        </a>
                    </figure>
                    <figure class="produkt">
                        <a href="#schuh">
                            <div class="bild">
                              <img src="bilder/schuh.jpg" alt="Schuh">
                    </div>
                            
                            <figcaption class="beschreibung">
                            <strong>Nike Air - 790€</strong>
                            <p>Toller Schuh mit dicker Sohle und guter Federung, wird meistens als Lauf- bzw. Freizeitschuh verwendet.</p>
                            </figcaption>
                        </a>
                    </figure>
                    <figure class="produkt">
                        <a href="#schuh">
                            <div class="bild">
                              <img src="bilder/schuh.jpg" alt="Schuh">
                            </div>
                            
                            <figcaption class="beschreibung">
                            <strong>Nike Air - 790€</strong>
                            <p>Toller Schuh mit dicker Sohle und guter Federung, wird meistens als Lauf- bzw. Freizeitschuh verwendet.</p>
                            </figcaption>
                        </a>
                    </figure>
                </div>
  } 
  @media screen and (min-width: 751px){
    #produkte {
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        flex-direction: column;
    }
}
    .produkt {
        width: 700px;
        border: solid #e4e4e4;
        background-color: white;
        padding: 10px;
        margin: 20px;
        height: 200px;
        text-align: left;
        height: 200px;    
    }
    .produkt img {
        width: 180px;
        padding: 15px;
    }
    a {
        font-size: x-large;
        color:#3f79e6;
        display: flex;
        text-decoration: none;
}
    @media screen and (max-width: 750px){
      #produkte {
          display: flex;
          flex-direction: column;
          align-items: center;
          max-width: 100%;
          height: auto;
      }
      .produkt a {
          display: flex;
      }
    }

Hey.

Ich hab auf meinem XAMPP Server eine Datenbank mit drei festen Usern. Diesen sind ein Nutzername/ID (z.B. 4644786744) und ein Passwort (z.B. 4vv41ge6w) zugewiesen.
In einer weiteren Datenbank stehen Datensätze mit Lizenzschlüsseln.

Nehmen wir an, es die Nutzer-IDs der User sind folgende:

ID von User-01: 64154186756
ID von User-02: 56416816489
ID von User-03: 47485694587

Angenommen, die Datenbank mit den Schlüsseln ist folgende:

LIZENZSCHLÜSSEL ID

v64v6d04s1vgb68rv 64154186756
b41aswgvb0n041nd4 64154186756
gbv145nj1r410ndss 64154186756
gvsagvb104gv84410 56416816489
w41fdw01scd485sw1 56416816489
gedavge68v1408041 47485694587

User-01 hat 3 Schlüssel. User-02 hat 2 Stück, und User-03 hat einen Lizenzschlüssel.

Meine Frage nun:

Ich möchte jetzt ein Login Formular haben, mit dem sich z.B. User-02 mit seiner ID als Nutzername und seinem Passwort als Passwort anmelden kann und so dann die zu ihm gehörigen Lizenzen einsehen kann.

Zu den drei Nutzern habe ich jeweils eine php-Datei. Führt man die Datei für User-03 aus, werden die dem User-03 zugewiesenen Lizenzen ausgegeben.

Wie schaffe ich es, dass wenn sich ein User anmeldet, dass das Skript dann auch auf "seine Datei" zugreift?

Ein bisschen Code wäre z.B. auch sehr hilfreich :)

Eine etwas längere Frage...
Aber vielen Dank für jede Antwort und Hilfe.

Ich bin absoluter Anfänger, nur im Voraus. Ist es möglich, anstatt bei jedem einzelnen Wert zu testen, ob er in der Variable enthalten ist, einfach zu testen, ob in der Variable, ein beliebiger Wert, beispielsweise ein Buchstabe enthalten ist, der auch in einem Array enthalten ist?

Also wenn wir eine Variable mit einem Text haben...

let str = "Hello World!";

und ein Array mit gewissen Buchstaben...

let arr = ["a","b","h"];

dass wir dann nicht prüfen

ist da jetzt a enthalten, ist da jetzt b enthalten...

sondern einfach:

ist in str ein Wert enthalten, der auch in arr ist

in dem Fall ist h enthalten

mein Ziel ist es dass er dann zurück gibt: ja es ist ein wert enthalten (boolean), also true

danke

ps bitte nicht ZU kompliziert

Ich brauche Hilfe, weil wir mit einem Schulprojekt bis morgen fertig sein müssen.

Es geht darum, eine HTML-Webseite mit Word zu erstellen und ggf. auch zu verlinken. Jedoch kommen jedes Mal, wenn ich die Seite öffnen möchte, nur wirre Zeichen. Kann mir bitte jemand helfen?

Hey.
Ich soll Werte in einer MySQL-Datenbank (über PHPMyAdmin auf XAMPP) in einer Seite anzeigen lassen (dieses soll dann später in WordPress installiert werden).

Ich habe lange gegooglet, finde aber nichts, wie ich das mit PHP machen kann.

Danke für jede Antwort :)

Ich frage den Nutzer wie sein Vorname ist.

let vorname = prompt("Wie lautet dein Vorname?");

Nun möchte ich das eingegebene auf der Seite Ausgeben.

Als dass da z.B. steht: Hallo Max

Wie kann ich das umsetzen? (Bin Anfänger)

Vielen Dank für eure Hilfe.

Ich würde gerne einen HTML Input Text in Javascript ausgeben lassen.

Dazu habe ich bereits ein Script erstellt, in dem ich einer Variable den Wert des HTML Input gebe(Es geht um die Variable "VorName"), mit Hilfe von "document.getElementById". Allerdings will die Variable den Wert nicht annehmen/ändert ihn nicht.

Ich habe auch onclick angewendet

Warum funktioniert das nicht? ) :

Danke im voraus für Tipps und Hilfe

Hallo, ich arbeite seit ungefähr drei Monaten mit html und habe jetzt ein Problem: Ich will einen Text neben mein Bild platzieren, doch immer wenn ich alles nach links floate zerstört das meine navigationsleiste. Möchte noch anmerken, dass meine Skills zu diesem Thema ziemlich beschränkt sind. Hier findet ihr mein CSS - unten html. Danke für eure hilfe! 😊

.topnav {

background-color: rgb(245, 245, 245);

overflow: hidden;

}

.topnav a {

float: left;

display: block;

color: #1d1d1d;

text-align: center;

padding: 14px 16px;

text-decoration: none;

font-size: 17px;

}

.topnav a:hover {

background-color: #ddd;

color: black;

}

.topnav a.active {

background-color: #3f79e6;

color: white;

}

.topnav .icon {

display: none;

}

@Media screen and (max-width: 600px) {

.topnav a:not(:first-child) {display: none;}

.topnav a.icon {

float: right;

display: block;

}

}

@Media screen and (max-width: 600px) {

.topnav.responsive {position: relative;}

.topnav.responsive a.icon {

position: absolute;

right: 0;

top: 0;

margin-left: 30px;

}

.topnav.responsive a {

float: none;

display: block;

text-align: left;

}

}

@Media screen and (min-width: 601px){

#produkte {

margin-left: 20%;

float: left;

}

}

.produkt {

width: 200px;

border: solid #dedcd9;

background-color: #f6f8fa;

padding: 10px;

margin: 20px;

display: block;

text-align: right;

height: 200px;

}

.produkt img {

width: 180px;

padding: 10px;

display: block;

}

p, a, h1, h2, h3, h4, h5, h6 {

font-family: Arial, Helvetica, sans-serif;

font-display: block;

}

a {

font-size: x-large;

color:#3f79e6;

}

Das ist mein html:

<!DOCTYPE html>

<html lang="de">

<head>

<meta-charset="utf-8">

<link rel="stylesheet" href="style.css">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<script>

function myFunction() {

var x = document.getElementById("myTopnav");

if (x.className === "topnav") {

x.className += " responsive";

} else {

x.className = "topnav";

}

}

</script>

</head>

<body>

<div class="topnav" id="myTopnav">

<a href="#home" class="active">Home</a>

<a href="#news">News</a>

<a href="#contact">Contact</a>

<a href="#about">About</a>

<a href="javascript:void(0);" class="icon" onclick="myFunction()">

<i class="fa fa-bars"></i>

</a>

</div>

<div id="produkte">

<div class="produkt" id="schuh"><a href="#schuh"><center><img src="bilder/schuh.jpg" alt="Schuh"></center></a></div>

<div class="desc"><a>Nike Air</a></div><p>Toller Schuh mit dicker Sohle und guter Federung, wird meistens als Lauf- bzw. Freizeitschuh verwendet.</p>

<div class="produkt" id="schuh"><a href="#schuh"><center><img src="bilder/schuh.jpg" alt="Schuh"></center></a></div>

<div class="produkt" id="schuh"><a href="#schuh"><center><img src="bilder/schuh.jpg" alt="Schuh"></center></a></div>

</div>

</body>

</html>

Wie mache ich das wenn jemand auf meine Website klickt und sie dann wieder verlassen möchte das dann oben vom Browser Angezeigt wird: "möchten sie wirklich diese Website Verlassen es könnte ungespeicherte Enderrungen geben" ?