Verwandte Themen

Frage
von RANGObro
07.06.2021, 22:09
Mit Links
HTML Email Style wird nicht richtig gerendert?

Folgender Code:

<html>
    <body>
        <div style="font-family: arial;">
            <h1 style="color: #007bff; letter-spacing: 2px; font-weight: 500;">Neue Nachicht von der Website!</h1>
            <div>
                <h2 style="margin-top: 2rem; margin-bottom: .5rem; letter-spacing: 2px; font-weight: 500;">Kontaktdaten</h2>
                <div style="margin-right: 70px; display: inline-block;">
                    <p style="margin: .6rem 0;">Vorname:</p>
                    <p style="margin: .6rem 0;">Nachanme:</p>
                    <p style="margin: .6rem 0;">Email Adresse:</p>
                    <p style="margin: .6rem 0;">Telefonnummer:</p>
                </div>
                <div style="display: inline-block;">
                    <p style="margin: .6rem 0;">${ firstname }</p>
                    <p style="margin: .6rem 0;">${ lastname }</p>
                    <p style="margin: .6rem 0;"><a style="color: #007bff; text-decoration: none;" href="mailto:${ email }">${ email }</a></p>
                    <p style="margin: .6rem 0;">${ htmlPhone }</a></p>
                </div>
            </div>
            <div>
                <h2 style="margin-top: 3rem; margin-bottom: 1rem; letter-spacing: 2px; font-weight: 500;">${ subject }</h2>
                <div style="font-size: 17px; padding-right: 11%; max-width: 900px;">${ message }</div>
            </div>
        </div>
    </body>
</html>

Eigentlich sollten bei den Kontaktdaten 2 Divs nebeneinander sein. Funktioniert auch wenn ich die Email über gmail.com aufrufe. Aber nicht in Windows Mail etc. Woran liegt das?

Computer, HTML, Style, programmieren, CSS, E-Mail-Adresse, node.js
1 Antwort
Frage
von Nuehm154
24.05.2021, 13:20
Mit Links
Wordpress transparenter Block hinter Text?

Hallo, ich arbeite gerade an einer Website und habe mir bei Wordpress.org das Theme VW Eco Nature ausgewählt.
Hier könnt ihr die Website mal sehen (ich bin noch nicht weit, ich weiß da passt noch einiges nicht, bin noch ganz am Anfang): https://biogemuesehof-hauser.de/

Ich würde gerne den aktuellen oder einen ähnlichen Hintergrund wählen, weil er tolle Farben hat und zu unserem Design passt. Ihr seht selbst dass ich dann Probleme mit der Textfarbe bekomme da der Hintergrund dann so unruhig ist und weder hell noch dunkle Textfarbe besonders schnike aussieht. Also bräuchte ich sowas wie einen transparenten hellen Block hinter dem Text so ähnlich wie im Header (den habe ich durch ein transparentes png bild hingekriegt, aber das sollte ja im mainblock nicht die Lösung sein) und so ähnlich wie hier (hier allerdings den hellen transparenten Block, nicht den weißen deckenden):

https://buture.blogspot.com/

Ich kann das leider nicht einstellen bei meinem Theme im Customizer, nun wurschtel ich mit ein paar Lösungsansätzen aus dem Netz in der style.css rum aber ich komm nicht auf das gewünschte Ergebnis. Kann mir jemand helfen? Damit ein schöner transparenter Block erscheint der in der Seitenmitte ist und natürlich schön mitscrollt je nachdem wie viel Text auf die Seite kommt?

Bin absolute Anfängerin aber wäre sehr froh um Hilfe damit ich nicht den kompletten Hintergrund wechseln muss nur weil das nicht klappt.

Vielen lieben Dank schonmal!!

HTML, CSS, WordPress, Wordpress Theme
1 Antwort
Frage
von Helpplshelp
28.04.2021, 22:44
HTML: Eingebundene CSS-Datei funktioniert nicht?

Hallo Leute,

ich habe seit heute mit dem Erstellen von Webseiten angefangen. Ich habe mir schon sehr viel dazu angeschaut und bin auch der Meinung, dass ich das meiste schon weiß.

Ich habe also eine HTML-Datei erstellt und wie es auch sein muss in den

<head>...</head>

einen Link zur entsprechenden CSS-Datei eingeführt. Der Link ist auch zu 100% korrekt, sowohl vom Aufbau als auch von der Rechtschreibung (insbesondere der Dateipfad).

Das HTML-Dokument lässt sich auch ganz normal im Internet abrufen, jedoch wird die CSS-Datei nicht ausgeführt (da die Farbe sich nicht verändert).

Es muss also etwas mit dem Link nicht stimmen, da die CSS-Datei auch keine Fehler enthält. Ich habe auch verschiedene Browser probiert.

Fakt ist: Ich habe schon alles probiert, tausendmal über alles drüber geschaut und auch im Internet nach ähnlichen Fehlern gesucht. Jedoch hat alles nicht geholfen.

Hier mein Code:

HTML:

<!DOCTYPE HTML>
<html>
  <head>
    <link href= "style.css" rel= "stylesheet" type= "css/txt" >
    <title>Regenwasser</title>
  </head>
  <body>
    <p><h1>Regenwasser</h1></p>
    <ul>
      <li>s</li>
      <li>l</li>
      <li>o</li>
      <li>l </li>
      <li>p-</li>
      <li>u</li>
      <li>P</li>
      <li>Fi</li>
      <li>Wass</li>
      <li>AQUA</li>
      <li>PLURAF</li>
      <li>AQ</li>
    </ul>
  </body>
</html>

CSS:

p {
  color: red;
}

ul li {
  color: green;
  height: 500px
}

Ich bin daran echt am Verzweifeln und sitze schon locker über zwei Stunden daran.

Computer, HTML, programmieren, CSS
6 Antworten
Frage
von Geomatrics1
02.03.2021, 22:13
Mit Bildern
Wie kann ich bei einer richtiger Antwort einen Text anzeigen lassen und bei einer falscher Antwort einen anderen?

 Ich möchte auf meiner Webseite ein kleines Multiple-choice-Quiz machen.

Hier möchte ich, dass, wenn man das Richtige auswählt und auf Lösung klickt, eine Nachricht erscheint, dass dies die richtige Lösung ist. Bei einer falschen dann halt, dass es die falsche Antwort ist.

Ich könnte hier nach action="/Tests/Posts" eine andere Webseite öffnen lassen. Aber dann würde sich ja bei der falschen Antwort und bei der richtigen Antwort das gleiche Fenster öffnen.

<form method="post" action="/Tests/Post">
  <fieldset>
    <legend>Bei Längswellen erfolgt die Schwingung ... Ausbreitungsrichtung.</legend>
    <input type="checkbox" name="schwingung" value="in" onclick="return ValidatePetSelection();">... in ...<br>
    <input type="checkbox" name="schwingung" value="querZur" onclick="return ValidatePetSelection();">... quer zur ...<br>
    <input type="checkbox" name="schwingung" value="Birds" onclick="return ValidatePetSelection();">... gegen ...<br>
    <br>
    <input type="submit" value="Lösung">
  </fieldset>
</form>
<script type="text/javascript">
  function ValidatePetSelection() {
    var checkboxes = document.getElementsByName("schwingung");
    var numberOfCheckedItems = 0;

    for (var i = 0; i < checkboxes.length; i++) {
      if (checkboxes[i].checked)
        numberOfCheckedItems++;
    }

    if (numberOfCheckedItems > 1) {
      alert("Es ist genau eine Antwort richtig.");
      return false;
    }
  }
</script>
Bild zum Beitrag
Computer, Schule, HTML, CSS, JavaScript, Script, checkbox, Multiple Choice
2 Antworten
Frage
von Fragesteller142
04.01.2021, 10:27
Frage wurde 1 Mal erneut gestellt
Mit Bildern
PHP Pascalsches Dreieck?

Hallo,

bin grad am "tüfteln" vom Pascalschen Dreieck und habe 2 Probleme:

Wieso haben bei mir die Zellen unterschiedliche Breiten, und, was ist der einfachste weg, dass es auch ausschaut wie ein Pascalsches Dreieck und nicht alles lin ksbündig ist?

Code

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Pascal'sches Dreieck</title>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
    <style>
    
    .table {
    font-family: Arial, Helvetica, sans-serif;
    border-style: solid 1px;
    border-spacing: 1;
    border-collapse: collapse;
    overflow: hidden;
    width: 70%;
    margin: 0 auto;
    position: relative;    
    }
    
    .zellen {
        border: 1px solid #000;
    }
    </style>
</head>
<body bgcolor=#DDDDDD text=#0000AA>

<form action="<?php $PHP_SELF ?>" method="post">
<pre>
eingabe:   <input type="text" name = "eingabe" size="4">


<input type="submit" name="schalter" value="OK">
</pre>
</form>

<?php

if(isset($_POST["schalter"])){
    
    $eingabe = $_POST["eingabe"];
    
    
    print "<table class=\"table\">";
    
    for($zeile = 1; $zeile <= $eingabe; $zeile++){ //Zeilen
        print "<tr>";
        for($spalte = 1; $spalte <= $zeile; $spalte++){ //Spalten
        
            if($spalte == 1 OR $spalte == $zeile){
                $array[$zeile][$spalte] = 1;
                print "<th class=\"zellen\">".$array[$zeile][$spalte]."</th>";
                

                
            }else{
                $array[$zeile][$spalte] = $array[$zeile-1][$spalte-1] + $array[$zeile-1][$spalte];
                
                print "<th class=\"zellen\">".$array[$zeile][$spalte]."</th>";
                
            }

            // $array[$i][$j] = 1;
        
            
        }    
    }
    print "</tr></table>";
    
    
    print "<pre>";
    print_r($array);
    print "</pre>";
}
?>
</body>

</html>

Ausgabe:

Bild zum Beitrag
Computer, programmieren, CSS, Infos, Array, Informatik, PHP, pascalsches-dreieck
2 Antworten
Frage
von Hardwaregamer
11.12.2020, 21:48
Mit Bildern
Wie kann ich diese Navbar fixieren?

Hallo,

ich mache gerade meine erste Website und kenne mich noch sehr wenig mit HTML/CSS aus. Ich schaffe es leider nicht, dass meine Navigation beim runter scrollen oben fixiert bleibt. Wie kann man das ausschließlich mit HTML und CSS (also kein Javascript oder so) beheben?

Hier der HTML-Code:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Unser Shop</title>
  <link rel="stylesheet" href="styles.css" type="text/css">
</head>


<body>


<div class="topnav">
  <img src="test.png" alt="test" width="100" height="40" style="float:left; margin-right:25px;">
  <a class="active" href="index.html">Willkommen</a>
  <a href="products.html">Unsere Produkte</a>
  <a href="about-us.html">Über uns</a>
</div>


<div class="page">
<p> Willkommen! </p>
</div>




</body>
</html>

Und hier der CSS-Code:

body {
  background-color: green;
  margin: 0px;
}


/* Add a black background color to the top navigation */
.topnav {
  background-color: #333;
  overflow: hidden;
}


/* Style the links inside the navigation bar */
.topnav a {
  float: left;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}


/* Change the color of links on hover */
.topnav a:hover {
  background-color: #ddd;
  color: black;
}


/* Add a color to the active/current link */
.topnav a.active {
  background-color: #4CAF50;
  color: white;
}


.page {
  background-color: white;
  margin-right: 125px;
  margin-left: 125px;
  padding-bottom: 85%;
}
Bild zum Beitrag
PC, Computer, Software, Technik, HTML, Webseite, programmieren, CSS, Technologie, fixieren
2 Antworten

Meistgelesene Fragen zum Thema CSS
Mehr meistgelesene Fragen zu CSS