PHP-Ausgabe stylen

  • Hallo zusammen, ich habe angefangen PHP zu lernen. Bei meinem Testformular konnte ich alles mit CSS wie gewünscht stylen, ausser die Ausgabe "Vorname":
    echo $_GET["vorname"];$datum = date("H:i:s"); (die zweitletzte Zeile vom Code)

    Der ganze Code lautet:
    <head>

    <link href="/wp-content/themes/twentytwelve-child/style.css" rel="stylesheet">

    </head>

    <div style="width:200px; margin:auto"> <!-- zentrieren -->

    <?php

    echo '

    <form action="formular-responsive.php" method="get">

    Ihr Vorname:

    <input type="text" name="vorname" id="vorname" value=""/>&nbsp;

    <input type="hidden" name="datum" id="datum" value="'. $datum .'" >

    <p><input type="submit" name="Button" id="Button"

    value="Absenden" /></p>

    <pl>Ihr eingegebener Vorname:</pl>

    </form>';

    echo $_GET["vorname"];$datum = date("H:i:s");

    ?>

    Live 1:1, siehe: https://www.m-schmid.ch/php/formular-einmitten.php

    Kann mir jemand mitteilen, wie ich die Ausgabe gemäss der zweitletzten Zeile mit CSS beeinflussen kann?

  • Hey,


    wenn du Sachen in php ausgibst und diese designen möchtest sollst du die Daten die du durch das Formular übermittelt bekommst zuerst mal in eine variable stecken.


    PHP
    <?php
    
    $vorname = $_GET['vorname'];
    $datum = date("H:i:s");
    
    ?>


    Nun kannst du $_GET['vorname']; in den <p>-Tag aus HTML reinschreiben und diesem p tag eine klasse geben.

    PHP
    <?php
    $vorname = '<p class="ausgabe">' . $_GET['vorname'] . '</p>';
    $datum = '<p class="datum">' . date("H:i:s") . '</p>';
    ?>

    Und nun kannst du diese 2 klassen über css designen.



    Gruß,

    Stef

  • Vielen Dank für die übersichtiche Erklärung Stef, doch leider funktioniert es bei mir nicht, d.h. wenn ich die Klasse "ausgabe" anspreche (margin-top:-1rem) passiert nichts.

    Hier mein Code von https://www.m-schmid.ch/formular-einmitten.php


    <head>

    <link href="/wp-content/themes/twentytwelve-child/style.css" rel="stylesheet">

    </head>


    <div style="width:200px; margin:auto"> <!-- zentrieren -->


    <?php
    $vorname = '<p class="ausgabe">' . $_GET['vorname'] . '</p>';
    $datum = '<p class="datum">' . date("H:i:s") . '</p>';


    echo '

    <form action="formular-design-alt" method="get">
    Ihr Vorname:
    <input type="text" name="vornamen" id="vornamen" value=""/>&nbsp;
    <input type="hidden" name="datum" id="datum" value="'. $datum .'" >
    <p><input type="submit" name="Button" id="Button"
    value="Absenden" /></p>
    <pl>Ihr eingegebener Vorname:</pl>

    </form>';

    echo $_GET['vorname'];$datum = date("H:i:s");


    ?>

  • Absatz-Tags im Input-Feld wird nicht funktionieren.

    Ausserdem wird im $_GET "vorname" verwendet, im Form des zweiten Betrags von dir aber "vornamen". Das funktioniert natürlich, aber nicht wie gewünscht. Vermutlich nur ein Tippfehler, aber das ist das Salz in der Suppe :) Richtig sollte es wohl "vorname" sein wie im ersten Beitrag.


  • Ich habe die Fehler korrigiert. Aber die Ausgabe mit der Klasse "ausgabe" ansprechen, funktioniert nicht.
    Mein Problem habe ich auf einfachere Art lösen können, indem ich den PHP-Code unterteilt habe, siehe die untersten vier Zeilen, so kann ich die Ausgabe direkt um 0.5rem nach oben schieben:


    </form>';
    ?>
    <p style="margin-top:-0.5rem"><?php echo $_GET['vorname'];$datum = date("H:i:s");?></p>
    </div>

  • Hey,


    es kann nicht sein das mein Beispiel nicht funktioniert.


    Schön das du es nun hinbekommen hast. Ich habe jetzt trotzdem mal ein script geschrieben, so wie ich es dir versucht habe zu erklären:


    Habe da nun auch die Fehlerbehandlung und Filterung der Eingabe welche sehr wichtig ist noch hinzugefügt.


    Stef

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!