HTML – die neusten Beiträge

Verwandte Themen
HomosexualGod
19.07.2022, 13:41

HTML Buttons alignment?

Moin, hier eine kleine Seite die Nur 3 Knöpfe ausgibt. Habe jetzt leider das Problem, dass die Knöpfe nicht auf gleicher höhe sind, trotz des "vertical-align:top" bin noch sehr neu in html, hoffe ihr könnt helfen. LG

Nachtrag: Habe es mit Padding gelöst, vielleicht geht es trotzdem besser anders?

<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <body>
        <style>
          .subscribe-button
          {
            background-color: rgb(204, 0, 0);
            color:white;
            border:none;
            border-radius:2px;
            cursor:pointer;
            margin-right:12px;
            transition:opacity 0.2s;
            padding-top:10px;
            padding-bottom:10px;
            padding-left:16px;
            padding-right:16px;
            vertical-align:top;
          }
          .subscribe-button:hover
          {
            opacity: 0.7;
          }
          .subscribe-button:active
          {
            opacity: 0.4;
          }
          .join-button:hover
          {
            background-color:
            rgb(37, 25, 207);
            color: white;
          }
          .join-button:active
          {
            opacity:0.7;
          }
          .join-button
          {
            background-color:white;
            color:rgb(37, 25, 207);
            border-color:rgb(37, 25, 207);
            border-style:solid;
            border-width:1px;
            border-radius:2px;
            cursor:pointer;
            margin-right:8px;
            transition:background-color 0.2s, color 0.2s, opacity 0.2s;
            padding-left:5px;
            padding-right:5px;
            padding-top:4px;
            padding-bottom:4px;
            vertical-align:top;
          }
          .tweet-button
          {
            color:white;
            background-color:rgb(67, 145, 235);
            height:36px;
            width:75px;
            border:none;
            border-radius:20px;
            font-weight:bold;
            font-size:15px;
            cursor:pointer;
            transition:box-shadow 0.15s;
            transition:opacity 0.2s;
            vertical-align:top;
          }
          .tweet-button:hover
          {
            box-shadow: 0px 5px 5px rgba(0,0,0,0.15);
          }
          .tweet-button:active
          {
            opacity:0.6;
          }
        </style>
        <button class="subscribe-button">
          SUBSCRIBE
        </button>
        <button class="join-button">
          JOIN my channel
        </button>
        <button class="tweet-button">
          Tweet
        </button>
        <btton
      </body>
  </head>
</html>
HTML, programmieren, HTML5
1 Antwort
anoyni
05.07.2022, 08:25
Mit Bildern

dieser Fehler in der css: "at-rule or selector expected"?

Hallo Ich habe diesen Fehler in meinem css, jemand weiß, wie man dieses Problem zu behebt? Wie auf dem Bild zu sehen ist, steht da "at-rule or selector expected", aber nach mehreren Versuchen weiß ich nicht, wie ich das Problem lösen kann. Bitte um Hilfe.

@charset "UTF-8"; 
{
  box-sizing: border-box;
}
body {
  font-size: 14px;
  font-family: Inter;
}
.v73_77 {
  width: 595px;
  height: 842px;
  background: rgba(255,255,255,1);
  opacity: 1;
  position: absolute;
  top: 0px;
  left: 0px;
  overflow: hidden;
}
.v73_79 {
  width: 451px;
  color: rgba(0,0,0,1);
  position: absolute;
  top: 139px;
  left: 53px;
  font-family: Inter;
  font-weight: Regular;
  font-size: 12px;
  opacity: 1;
  text-align: left;
}
.v73_80 {
  width: 160px;
  height: 160px;
  background: rgba(255,243,236,0);
  opacity: 1;
  position: absolute;
  top: 228px;
  left: 28px;
  border: 1px solid rgba(255,117,51,1);
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  overflow: hidden;
}
.v73_81 {
  width: 160px;
  height: 160px;
  background: rgba(255,243,236,0);
  opacity: 1;
  position: absolute;
  top: 228px;
  left: 213px;
  border: 1px solid rgba(255,117,51,1);
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  overflow: hidden;
}
Bild zum Beitrag
HTML, programmieren, CSS, Code
2 Antworten
DianaElydor95
19.06.2022, 15:51

JavaScript will nicht (Text in Element ändern per onclick)?

Hallo alle miteinander,

ich tüftle derzeit daran, den Text eines Elements zu ändern, sobald im unteren Menü ein Feld angeklickt wurde. Das Ganze funktioniert jedoch nicht und ich verstehe nicht wirklich warum. Könnt ihr mir helfen den Fehler zu finden?

Die wli-Variablen sollen den neuen Text enthalten, da ich das für jemanden programmiere, der keine Ahnung von JavaScript hat und ich es somit vereinfachen wollte, das er den Text ohne etwas kaputt zu machen, bearbeiten kann.

Hier einmal der Code, an dem ich herumprobiert habe. Allerdings ohne den CSS-Teil:

<script type="text/javascript">
  wli1 = "wli1";
  wli2 = "wli2";
  wli3 = "wli3";
  wli4 = "wli4";
  wli5 = "wli5";
  wli6 = "wli6";

  function fwli1() {
    document.getElementById("werdegangcon").value = wli1;
  }

  function fwli2() {
    document.getElementById("werdegangcon").value = wli2;
  }

  function fwli3() {
    document.getElementById("werdegangcon").value = wli3;
  }

  function fwli4() {
    document.getElementById("werdegangcon").value = wli4;
  }

  function fwli5() {
    document.getElementById("werdegangcon").value = wli5;
  }

  function fwli6() {
    document.getElementById("werdegangcon").value = wli6;
  }
</script>
<div class="conh15">
  <div class="con100">
    <div class="con_top center nummer">
      <h3>Werdegang</h3>
    </div>
    <div class="con_mid center" id="werdegangcon">
      2394    Abschluss des Abiturs mit Auszeichnung</br>
      2394    Job als Haustechnikerin
    </div>
    <div class="con_bot center">
      <ul class="werdegang">
        <li id="weli1" onclick="fwli1()">vor der Akademie</li>
        <li id="weli2" onclick="fwli2()">2395</li>
        <li id="weli3"onclick="fwli3()">2399</li>
        <li id="weli4"onclick="fwli4()">2401</li>
        <li id="weli5"onclick="fwli5()">2402</li>
        <li id="weli6" onclick="fwli6()">2403</li>
      </ul>
    </div>
  </div>
</div>
HTML, programmieren, JavaScript
1 Antwort
Reini16
12.06.2022, 18:40

HTML Kontaktformular per PHP an Mail senden?

Hallo, ich hab ein Kontaktformular in HTML erstellt bei dem man auch Dateien hochladen kann. Ich hab es auch schon so eingestellt dass alle Daten (Antworten) an mich per Mail gesendet werden, allerdings schaffe ich es nicht dass auch die Dateien als Anhang in der Mail mit gesendet werden, kann mir dabei jemand helfen?

Hier mein Code:

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="style.css" type="text/css">
    <title>NAME | Kontakt</title>
    <meta charset="utf-8">
   </head>
   <body>
    <div id="wrapper">
      <header><a href="index.html"><img src="bilder/logo vorschau.png" alt="Das Logo konnte nicht geladen werden!"></a></header>


      <nav>
        <ul>
          <li><a href="index.html">Home</a></li>
          <li><a href="ueber.html">Über</a></li>
          <li><a href="kontakt.html"><b>Kontakt</b></a></li>
        </ul>
      </nav>


      <section>
        <div id="kontaktformular">
          <h1>Wie können wir dir helfen?</h1>
          <?php
          if(isset($_POST["submit"])){
            mail("reinhard.habisohn@icloud.com", "Kontaktformular von ".$_POST["name"], 'Name: '.$_POST["name"].' ||  Email: '.$_POST["email"].' ||  Telefonnummer: '.$_POST["telefon"].' ||  Priorität: '.$_POST["priorität"].' ||  Betreff: '.$_POST["betreff"].' ||  Nachricht: '.$_POST["message"]);
            ?>
            <em><h1 style="color: green;">Deine Anfrage wurde erfolgreich versendet!</h1><a>(Die Antwort senden wir dir an die angegebene E-Mail Adresse!)</a></em>
            <?php
          }
           ?>
          <form action="index.php" method="post" enctype="multipart/form-data">
            <br><label>Name:</label><br>
            <input type="text" name="name" required><br>
            <br><label>E-Mail:</label><br>
            <input type="email" name="email" required><br>
            <br><label>Telefonnummer (optional):</label><br>
            <input type="number" name="telefon"><br>
            <br><label>Wichtigkeit:</label><br>
            <select name="priorität" required>
              <option value"gering">Gering</option>
              <option value"mittel">Mittel</option>
              <option value"hoch">Hoch</option>
            </select><br>
            <br><label>Betreff:</label><br>
            <input type="text" name="betreff" required><br>
            <br><label>Nachricht:</label><br>
            <textarea rows="7" name="message" required></textarea><br>
            <br><label>Anhang (optional):</label><br>
            <input type="file" name="datei[]" multiple><br>
            <br><button type="submit" name="submit">Absenden</button>
          </form>
        </div>
      </section>
    </div>
  </body>   
</html>

Vielen Dank im Vorhinein!

Computer, HTML, Kontakt, PHP, kontaktformular
2 Antworten
TimeTravel3
11.06.2022, 20:33

HTML Form auswerten und neue Füllen?

Hey!

Ich habe folgende Input form:

        <form action="/calculate" method="GET">
            <br><label for="KM_cost_truck_a">KM cost truck a</label>
            <input required placeholder="10" ype="text" id="KM_cost_truck_a" name="KM_cost_truck_a"><br>
    
            <label for="KM_cost_truck_b">KM cost truck b</label>
            <input required placeholder="9" type="text" id="KM_cost_truck_b" name="KM_cost_truck_b"><br>
    
            <label for="Product_cost_a">Product cost a</label>
            <input required placeholder="7" type="text" id="Product_cost_a" name="Product_cost_a"><br>
    
            <label for="Product_cost_b">Product cost b</label>
            <input required placeholder="11" type="text" id="Product_cost_b" name="Product_cost_b"><br>
    
            <label for="Source_a_location">Source a location</label>
            <input required placeholder="Berlin" type="text" id="Source_a_location" name="Source_a_location"><br>
    
            <label for="Source_b_location">Source b location</label>
            <input required placeholder="Paris" type="text" id="Source_b_location" name="Source_b_location"><br>
    
            <label for="Truck_a_capacity">Source a capacity</label>
            <input required placeholder="5" type="text" id="Truck_a_capacity" name="Truck_a_capacity"><br>
    
            <label for="Truck_b_capacity">Source b capacity</label>
            <input required placeholder="3" type="text" id="Truck_b_capacity" name="Truck_b_capacity"><br>


            <button type="submit" id="calcbtn" value="Submit">Calculate</button>
        </form>

Die eine Anfrage an meinen Server schickt und die ergebnisse dann auf eine neue Seite kommen. (Man wirt weitergeleitet)

Wie kann ich eine neue form mit der Antwort vom server füllen?

HTML, JavaScript, Webentwicklung
2 Antworten
Sktzaag
09.06.2022, 07:06

Navigationsleiste auf andere html?

Hallo, ich bin ziemlich neu was Websides programmieren angeht und ich finde kein gutes tutorial dazu, wie man wenn man eine Navigationsleiste hat z.b auf Getränke klickt und dann eine andere html/css Seite mit Getränken auftaucht etc.

versuche da auxh bisschen JavaScript mit rein zubringen d.h Benutze die Navigationsleiste von Material Design Lite.

Bin da bisschen überfragt und habe keine ahnung😅

<!-- Always shows a header, even in smaller screens. -->
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
  <header class="mdl-layout__header">
    <div class="mdl-layout__header-row">
      <!-- Title -->
      <span class="mdl-layout-title">Title</span>
      <!-- Add spacer, to align navigation to the right -->
      <div class="mdl-layout-spacer"></div>
      <!-- Navigation. We hide it in small screens. -->
      <nav class="mdl-navigation mdl-layout--large-screen-only">
        <a class="mdl-navigation__link" href="">Link</a>
        <a class="mdl-navigation__link" href="">Link</a>
        <a class="mdl-navigation__link" href="">Link</a>
        <a class="mdl-navigation__link" href="">Link</a>
      </nav>
    </div>
  </header>
  <div class="mdl-layout__drawer">
    <span class="mdl-layout-title">Title</span>
    <nav class="mdl-navigation">
      <a class="mdl-navigation__link" href="">Link</a>
      <a class="mdl-navigation__link" href="">Link</a>
      <a class="mdl-navigation__link" href="">Link</a>
      <a class="mdl-navigation__link" href="">Link</a>
    </nav>
  </div>
  <main class="mdl-layout__content">
    <div class="page-content"><!-- Your content goes here --></div>
  </main>
</div>
Computer, Homepage, HTML, IT, Webseite, programmieren, CSS, JavaScript, Webdesign, Webentwicklung
2 Antworten
Jimmy286
08.06.2022, 22:10

PHP: Ergebnis erst später aufdecken nach Antwort?

Hey,

ich habe folgenden html und php-Code.

<form action="Subtraktion (1).php" method="post" target="">
<table>
<tr>
<td><font face="Roboto Slab" size=+1>Anzahl der Aufgaben eingeben</font></td>
<td><input type="Text" name="z" value="" size="" maxlength=""></input></td>
<td align="center"><input type="submit"  style="font-family: 'Roboto Slab'"  background-color="black" name="y" value="Absenden"></td></tr>
</table>
<br>
</form>

<?php
if((isset($_POST['z'])) and (is_numeric($_POST['z'])))
{
$zahl = $_POST['z'];

{

 while($zahl>0)
  {

  $a = rand(5, 10);
  $b = rand(0, 5);
  $erg = $a - $b;
  $zahl = $zahl - 1;

  echo "<table class='Tab'>";
  echo "<table border='1'>";
  echo "<tr> <td>$a - $b = ?</td> <td><input type=\"Text\" name=\g\"  value=\"\">\n</td><td>$a - $b = $erg</td></tr>";
  echo "</table>";
}
}}

?>
</body>
</html>

Damit soll der Nutzer Aufgaben – so viel wie er anfangs ausgewählt hat, berechnet können. Die Aufgaben bestehen hierbei aus zufälligen Zahlen. Meine Frage wäre jetzt: wie ich es schaffen kann (mit eher einfachen Befehlen), den Code so zu schreiben, dass das Ergebnis – hier: $a - $b = $erg – erst enthüllt wird, sobald der Nutzer ins Textfeld seine Antwort zur Aufgabe eingegeben hat?

Hier nochmals die Stelle (auch oben zusammen mit dem gesamten Code sichtbar):

echo "<table class='Tab'>";
echo "<table border='1'>";
echo "<tr> <td>$a - $b = ?</td> <td><input type=\"Text\" name=\g\" value=\"\">\n</td><td>$a - $b = $erg</td></tr>";
echo "</table>";

Vielen Dank :)

HTML, programmieren, rechnen, PHP, Textfeld, Variablen, Zufallszahlen, Antwort
3 Antworten

Meistgelesene Beiträge zum Thema HTML
Mehr meistgelesene Fragen zu HTML