nicht angemeldet
Meine code ,ich wird gepostet wie die Ordnung hat..
PHP
<?php ### messages.php ### utf8 ### äöüÄÖÜ ###
header('Content-Type: text/html; Charset=utf-8');
mb_internal_encoding('UTF-8');
date_default_timezone_set('Europe/Berlin');
?>
HTML
<html>
<head>
<title>Kontakt</title>
<style>
CSS
body {
background-color: #ebf5d7;
grid-gap: 5px;
grid-template-columns: 10% 72% 17%;
grid-template-areas:
"header header header"
"nav nav nav"
"linkBox linkBox linkBox"
"main main main"
"infoBox infoBox infoBox"
"footer footer footer" ;
}
@media screen and (min-width: 40em) {
body {
display: grid;
grid-template-columns: 10% 72% 17%;
grid-template-areas:
"header header header"
"nav nav nav"
"linkBox main infoBox"
"footer footer footer";
}
}
body > header {
grid-area: header;
background-image: url("../meine2.png");
padding: 60px;
}
body > nav {
grid-area: nav;
background-color: #d2f5c4;
}
body > #externalLinks {
grid-area: linkBox;
background-color: #d2f3c6;
;
}
body > main {
grid-area: main;
background-color: #eaf6e5;
}
body > #furtherInformation {
grid-area: infoBox;
background-color: #d2f3c6;
}
body > footer {
grid-area: footer;
background-color: #99ee7a;
}
/* Nav */
nav {background-color: #d2f5c4;}
nav a{
color: black;
text-decoration: none;
display: inline;
padding: 0px 8px;
font-size: 17px;
font-family: Candara, Calibri, Segoe, "Segoe UI", Optima, sans-serif;
}
nav ul {list-style-type: none;}
nav li {display: block;display:inline-block;}
/* ExternalLinks */
#externalLinks a {
text-decoration: none;
display: block;
text-align: center;
font-size: 15px;
font-family: Candara, Calibri, Segoe, "Segoe UI", Optima, sans-serif;
}
#externalLinks ul {
list-style-type: none;
margin: 5px;
padding: 0;
}
#externalLinks li{float: left}
/* Geben an Link1, link2, link3 ; Farbe , Padding, .... */
li a, .dropbtn {
display: block;
color: #000;
padding: 8px 16px;
text-decoration: none;
}
li a:hover, .dropdown:hover .dropbtn { background-color: #f1ebeb;}
.dropdown-content {
display: none; /* display wird ausgeschaltet ,aber erlaubt die anderen elemente, position ,background ,.... */
font-size: 15px;
position: absolute; /* die stellung folgt der Erste Link(li) */
background-color: #f1f1f1 ;
min-width: 160px; /* macht größer die Inneren Links */
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); /* Bau ein Schatte und geben an dem Schatten Farbe */
z-index: 1; /* Zeigen die Ordnung wie die Links gezeigt werden... */
}
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none; /* Bekomme die Liks keine Unten Stricht ....*/
display: block;
}
.dropdown-content a:hover {
background-color: #9f9e9e;
}
/* Offnen die Innere Links */
.dropdown:hover .dropdown-content {
display: block;
left: 109px; /* zeigt wo dem innere link fenster gezeigt wird */
top: 214px; /* zeigt wo dem innere link fenster gezeigt wird */
}
/* Main */
input, textarea{
background:rgba(220,220,220,0.75);
border:1px solid rgba(220,220,220,0.75);
font:inherit;
border-radius:0.2941em;/*5px;*/
padding:0.4118em;/*7px;*/
/*farbigen Rahmen in Chrome und Safari abschalten.*/
outline:none;
}
input:focus, textarea:focus{
background:#fff;
border:1px solid #000;
outline: none; /* einige Browser add line auf input , das verhindert es... */
}
input[type=submit]{
background:#be633c;
border:none;
color:#fff;
border-radius:50% 50%;
box-shadow:inset 0 0 1em #fb9d23;
padding:0.5882em;/*10px*/
}
input[type=submit]:focus, input[type=submit]:active{
background-color:#A33202;
}
/* Footer */
#copry {
overflow: auto;
font-size: 2px;
list-style-type: none;
font-family: Candara, Calibri, Segoe, "Segoe UI", Optima, sans-serif;
}
#img1 {float: left;margin-bottom: 3px;}
#copry a {text-decoration: none;margin-bottom: 3px;}
#copry p {font-size: 10px;margin-bottom: 0;}
HTML
~~~html
<body>
<header></header>
<nav>
<ul>
<li><a href="https://wiki.selfhtml.org/wiki/HTML/Seitenstrukturierung/nav">Home</a></li>
<li><a href="https://wiki.selfhtml.org/wiki/HTML/Tutorials/HTML5-Seitenstrukturierung">About Us</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
<aside id="externalLinks">
<ul>
<li class="dropdown">
<a href="#" class="dropbtn">Computer</a>
<div class="dropdown-content">
<a href="#">Linux Mint</a>
<a href="#">Ubuntu</a>
<a href="#">Debian</a>
<a href="#">Android</a>
</div>
<li><a href="#">News</a></li>
<li><a href="#">Bucher</a></li>
</ul>
</aside>
<main>
<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
<p>Vorname *<br>
<input placeholder="my name" name="name" size="30" maxlength="50" type="text">
</p>
<p>E-Mail *<br>
<input placeholder="mail@example.com" name="email" size="30" maxlength="50" type="email">
<br>
</p>
<p>Nachricht *<br>
<textarea placeholder="Write something to us" name="text" rows="5" cols="40" maxlength="200" style="width: 678px; height: 203px;"></textarea>
</p>
<p>
<input value="absenden" type="submit">
</p>
</form>
PHP
~~~php
<?php
### Wenn die Felder für die Pflichteingaben alle gesendet wurden,
### Daten und Markup gemischt wegschreiben in Datei:
if(isset($_POST['post'], $_POST['name'], $_POST['text']))
{
### hier eventuell noch prüfen, ob die Felder auch ausgefüllt wurden
$write = fopen('messages.inc.html', "a+");
fwrite($write, '<u><b>' . htmlspecialchars($_POST['name']) . '</b></u><br>' .
htmlspecialchars($_POST['text']) . PHP_EOL .
'<hr>' . PHP_EOL);
fclose($write);
}
### wenn eine Datei vorhanden ist, alle Daen auslesen:
clearstatcache(); ### ist notwendig, da PHP Datei-Metadaten zwischenspeichert
if ($read = @fopen('messages.inc.html', "rb"))
{
echo "<h2>Read all Messages:</h2>";
while(!feof($read))
{
echo fread($read, 1024);
}
fclose($read);
}
### sonst eine Message ausgeben:
else
{
echo "<h2>No Messages availabe</h2>";
}
?>
HTML
~~~html
</main>
<aside id="furtherInformation"></aside>
<footer id="copry" >
<p>My Website: Linux and More © 2018. All Rights Reserved.</p>
<a id="img1" href="https://creativecommons.org/licenses/by-nc/4.0/"><img alt="Creative Commons License" width="120px" height="40px" src="../CC-Lizenz.png" ></a>
<p>This work is licensed under a Creative Commons Attribution-NonCommercial 4.0<br> International License.
Content of this site cannot be republished<br> either online or offline without our permissions. </p>
</footer>
</body>
</html>
TS