Beiträge von retnüg

retnüg

Danke, dann muß ich die Seite neu aufbauen.

retnüg

Danke, nun habe ich ein neues Problem:
Die Vorschau in Dreamweaver ist ok, wenn ich aber die Datei dann abspeichere und diese index.html im Browser aufrufe habe ich ein völlig anderes Bild.

Wie ist das möglich? Was ist nun die wirkliche Seite?

retnüg

Danke MrMurphy
und wenn ich z.B. für h3 festlegen will, dann

HTML

.content h3 {
font-family: deineAngaben;
font-size: deineAngaben;
text-align: center;
letter-spacing: 0rem;
}

richtig so?

retnüg

hier das gesamte html:

HTML

<!DOCTYPE html>
<html lang="de">
<head>
   <meta charset="utf-8">
   <title>Malerei2000</title>
   <meta name="description"Der Autor gibt Einblick in sein künstlerisches Schaffen;Malerei, Acrylmalerei Aquarelle "Platzhalter - Ein kurze Beschreibung des Inhalts in Satzform">
    <meta name="Keywords" content=Malerei, Acryl, Aquarelle>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <!-- <link href="../css/zentrale.css" rel="stylesheet"> -->

   <style>


   /*Icon-Font - font-family: 'FontAwesome';*/
   @import url(http://fontawesome.io/assets/font-awesome/css/font-awesome.css);


   /*Überschriften - font-family: 'Roboto Slab', Serif;*/
   @import url(https://fonts.googleapis.com/css?family=Roboto+Slab);


   /*Fließtext - font-family: 'Roboto', Sans-Serif";*/
   @import url(https://fonts.googleapis.com/css?family=Roboto);


   /*Zahlen* - font-family: 'Merriweather';*/
   @import url(https://fonts.googleapis.com/css?family=Merriweather);


 
   /*Icon-Font - font-family: 'FontAwesome';*/
   @import url(http://fontawesome.io/assets/font-awesome/css/font-awesome.css);


   /*Überschriften - font-family: 'Roboto Slab', Serif;*/
   @import url(https://fonts.googleapis.com/css?family=Roboto+Slab);


   /*Fließtext - font-family: 'Roboto', Sans-Serif";*/
   @import url(https://fonts.googleapis.com/css?family=Roboto);


   /*Zahlen* - font-family: 'Merriweather';*/
   @import url(https://fonts.googleapis.com/css?family=Merriweather);


   /*Basisangaben*/
   @media all {
      header, nav, main, aside, footer, section, article, figure, figcaption, audio, video {
         display: block;
      }
      * {
         /*box-sizing: border-box;*/
         min-width: 1px;
      }
      html {
      }
      body {
         padding: 1rem 0.5rem 2rem 0.5rem;
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*Schriften*/
   @media all {
      html {
         font-family: sans-serif;
         font-size: 120%;
         line-height: 1.3;
      }
      h1 {
         font-family: 'Felix titling', serif;
         font-size: 2.3rem;
         color: #2233dd;
         letter-spacing: 0.1rem;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      h2, h3, h4, h5, h6 {
         font-family: 'Roboto Slab', serif;
         font-size: 1rem;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      p, li, dl, dt, address {
         font-family: Roboto, sans-serif;
         font-size: 1rem;
         font-style: normal;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      a {
         /*darkblue*/
         color: hsla(240, 100%, 27%, 1);
         text-decoration: none;
         outline: none;
         margin: 0rem 0rem 0rem 0rem;
      }
      figcaption {
         font-family: Roboto, sans-serif;
         font-size: 0.9rem;
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*Grafiken*/
   @media all {
      figure {
         min-width: 1px;
         max-width: 100%;
         min-height: 1px;
         margin: 0,1rem;
      }
      img {
         min-width: 1px;
         display: block;
         max-width: 100%;
         /*max-height: 100vh;*/
         border: 0;
      }
   }


   /*Listen dl*/
   @media all {
      dl {
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      dt,
      dd {
      }
      dt {
         font-weight: bold;
         margin: 0rem 0rem 0rem 0rem;
      }
      dd {
         margin: 0rem 0rem 1rem 0rem;
      }
      dd p {
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*body*/
   @media all {
      body {
      }
   }
   @media only screen and (min-width: 1000px) {
      body {
         display: flex;
         flex-wrap: wrap;
         justify-content: center;
      }
   }


   /*.pageheader*/
   @media all {
      .pageheader {
         background-color: #97FFFF;
         border: 1px solid black;
      }
      .pageheader h1 {
         text-align: center;
       }

   }
   @media only screen and (min-width: 1000px) {
      .pageheader {
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 0rem - 2px - 0rem);
      }
   }


   /*.navigation*/
   @media all {
      .navigation ,.sidebar span.Stil1{
         background-color: #63B8FF;
         padding: 0.5rem;
         margin: 0.5rem 0rem;

   }
     a:hover{

}
   @media only screen and (min-width: 1000px) {
     .navigation a,.sidebar span.Stil1,
      .navigation a:visited {
         display: block;
         color:     #483d8b;
         font-weight: bold;
         padding: 0.3rem;
         border: 1px solid black;
         border-radius: 0.3rem;
      }
     .sidebar span.Stil1:hover{
        background-color: black;
         color: gold;

     }
      .navigation a:hover,
      .navigation a:active,
      .navigation a:focus {
         background-color: black;
         color: gold;
       }


   /*.content*/
   @media all {
      .content {
         background-color: #63B8FF;
         border: 2px solid black;
         padding: 0.5rem;
         margin: 0.5rem 0rem;
      }
      .content h2 {
         color: #FFFF33;
         text-align: center;
      }
      .content figure {
         max-width: 600px;
         margin: 0rem auto;
      }
   }
   @media only screen and (min-width: 1000px) {
      .content {
         margin: 0.5rem 1rem;
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 250px - 250px - 1rem - 2px - 2rem);
      }
   }


   /*.sidebar*/
   @media all {
      .sidebar {
         background-color: #63B8FF;
         color:    #483d8b;
          font-weight: bold;
         padding: 0.5rem;
         border: 2px solid #63B8FF;
         margin: 0.5rem 0rem;
      }
   }
   @media only screen and (min-width: 1000px) {
      .sidebar {
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(250px - 1rem - 4px - 0rem);
      }
   }


 
   /*.pagefooter*/
   @media all {
      .pagefooter {
         padding: 0.5rem;
         border: 2px solid black;
         margin: 0.5rem 0rem;
      }
   }
   @media only screen and (min-width: 1000px) {
      .pagefooter {
         background-color: #97FFFF;
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 1rem - 4px - 0rem);
      }
   }


   /*Vorlagen zum Kopieren*/
   /*CSS*/
   @media all {
   }
   @media only screen and (min-width: 0px) {
   }
   @media only screen and (max-width: 0px) {
   }


   .Stil1 {color: #0000FF}
 


   .Stil1 {color: #0000FF}
   </style>
   <link rel="icon" type="image/vnd.microsoft.icon" href="www.guenter-leipfinger.de/favicon.ico">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head>
<body>
   <header class="pageheader">
      <h1>Herzlich willkommen</h1>
   </header>
   <nav class="navigation">

       <p><a href="http://guenter-leipfinger.de/photoalben/photoalben.html">Photoalben</a></p>
     <p><a href="http://guenter-leipfinger.de/Kontakt.html">Kontakt</a></p>
      <p><a href="http://guenter-leipfinger.de/impressum.html">Impressum</a></p>
      <p><a href="http://gb.webmart.de/gb.cfm?id=1331502l" http:="" gb.webmart.de="">Gästebuch</a></p>
      <p>&nbsp;</p>
       <p><br><br><br>


        
           <script type="text/javascript" src="https://whomania.com/count/m09"></script><br>
<script type='text/javascript' src='https://whomania.com/ctr?id=c8dd0b5dbfd3c513de59066eb38d052a2bd230a0'></script>


        <br>



      </p>


    </span></div>
     <div align="center"><span><p style="font-size:12pt;">Letzte Aktualisierung:</p>
  <!--?php echo date("d.m.Y, H:i:s",filectime("index.php"));
?-->
    <script type="text/javascript">
document.write(new Date().getDatenew Date().getMonth()+1)+"."+new Date().getFullYear())
  </script>20.2.2018<p></p>


      
   </span></div></nav>


      
   </nav>

   <main class="content">

       <center><h1>Fotografie</h1></center>
      <figure>
        <div align="center"><img src="http://guenter-leipfinger.de/libelle.jpg" alt="Fotografie" align="middle"></div>
      </figure>
      <footer class="contentfooter">      </footer>
   </main>

</body>


</html>






</html>

Alles anzeigen

retnüg

Hallo, wo kann ich die Schriftart bestimmen:
hier mal der css-code:

HTML

<style>


   /*Icon-Font - font-family: 'FontAwesome';*/
   @import url(http://fontawesome.io/assets/font-awesome/css/font-awesome.css);


   /*Überschriften - font-family: 'Roboto Slab', Serif;*/
   @import url(https://fonts.googleapis.com/css?family=Roboto+Slab);


   /*Fließtext - font-family: 'Roboto', Sans-Serif";*/
   @import url(https://fonts.googleapis.com/css?family=Roboto);


   /*Zahlen* - font-family: 'Merriweather';*/
   @import url(https://fonts.googleapis.com/css?family=Merriweather);


 
   /*Icon-Font - font-family: 'FontAwesome';*/
   @import url(http://fontawesome.io/assets/font-awesome/css/font-awesome.css);


   /*Überschriften - font-family: 'Roboto Slab', Serif;*/
   @import url(https://fonts.googleapis.com/css?family=Roboto+Slab);


   /*Fließtext - font-family: 'Roboto', Sans-Serif";*/
   @import url(https://fonts.googleapis.com/css?family=Roboto);


   /*Zahlen* - font-family: 'Merriweather';*/
   @import url(https://fonts.googleapis.com/css?family=Merriweather);


   /*Basisangaben*/
   @media all {
      header, nav, main, aside, footer, section, article, figure, figcaption, audio, video {
         display: block;
      }
      * {
         /*box-sizing: border-box;*/
         min-width: 1px;
      }
      html {
      }
      body {
         padding: 1rem 0.5rem 2rem 0.5rem;
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*Schriften*/
   @media all {
      html {
         font-family: sans-serif;
         font-size: 120%;
         line-height: 1.3;
      }
      h1 {
         font-family: 'Felix titling', serif;
         font-size: 2.3rem;
         color: #2233dd;
         letter-spacing: 0.1rem;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      h2, h3, h4, h5, h6 {
         font-family: 'Roboto Slab', serif;
         font-size: 1rem;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      p, li, dl, dt, address {
         font-family: Roboto, sans-serif;
         font-size: 1rem;
         font-style: normal;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      a {
         /*darkblue*/
         color: hsla(240, 100%, 27%, 1);
         text-decoration: none;
         outline: none;
         margin: 0rem 0rem 0rem 0rem;
      }
      figcaption {
         font-family: Roboto, sans-serif;
         font-size: 0.9rem;
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*Grafiken*/
   @media all {
      figure {
         min-width: 1px;
         max-width: 100%;
         min-height: 1px;
         margin: 0,1rem;
      }
      img {
         min-width: 1px;
         display: block;
         max-width: 100%;
         /*max-height: 100vh;*/
         border: 0;
      }
   }


   /*Listen dl*/
   @media all {
      dl {
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      dt,
      dd {
      }
      dt {
         font-weight: bold;
         margin: 0rem 0rem 0rem 0rem;
      }
      dd {
         margin: 0rem 0rem 1rem 0rem;
      }
      dd p {
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*body*/
   @media all {
      body {
      }
   }
   @media only screen and (min-width: 1000px) {
      body {
         display: flex;
         flex-wrap: wrap;
         justify-content: center;
      }
   }


   /*.pageheader*/
   @media all {
      .pageheader {
         background-color: #97FFFF;
         border: 1px solid black;
      }
      .pageheader h1 {
         text-align: center;
       }

   }
   @media only screen and (min-width: 1000px) {
      .pageheader {
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 0rem - 2px - 0rem);
      }
   }


   /*.navigation*/
   @media all {
      .navigation ,.sidebar span.Stil1{
         background-color: #63B8FF;
         padding: 0.5rem;
         margin: 0.5rem 0rem;

   }
     a:hover{

}
   @media only screen and (min-width: 1000px) {
     .navigation a,.sidebar span.Stil1,
      .navigation a:visited {
         display: block;
         color:     #483d8b;
         font-weight: bold;
         padding: 0.3rem;
         border: 1px solid black;
         border-radius: 0.3rem;
      }
     .sidebar span.Stil1:hover{
        background-color: black;
         color: gold;

     }
      .navigation a:hover,
      .navigation a:active,
      .navigation a:focus {
         background-color: black;
         color: gold;
       }


   /*.content*/
   @media all {
      .content {
         background-color: #63B8FF;
         border: 2px solid black;
         padding: 0.5rem;
         margin: 0.5rem 0rem;
      }
      .content h2 {
         color: #FFFF33;
         text-align: center;
      }
      .content figure {
         max-width: 600px;
         margin: 0rem auto;
      }
   }
   @media only screen and (min-width: 1000px) {
      .content {
         margin: 0.5rem 1rem;
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 250px - 250px - 1rem - 2px - 2rem);
      }
   }


   /*.sidebar*/
   @media all {
      .sidebar {
         background-color: #63B8FF;
         color:    #483d8b;
          font-weight: bold;
         padding: 0.5rem;
         border: 2px solid #63B8FF;
         margin: 0.5rem 0rem;
      }
   }
   @media only screen and (min-width: 1000px) {
      .sidebar {
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(250px - 1rem - 4px - 0rem);
      }
   }


 
   /*.pagefooter*/
   @media all {
      .pagefooter {
         padding: 0.5rem;
         border: 2px solid black;
         margin: 0.5rem 0rem;
      }
   }
   @media only screen and (min-width: 1000px) {
      .pagefooter {
         background-color: #97FFFF;
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 1rem - 4px - 0rem);
      }
   }


   /*Vorlagen zum Kopieren*/
   /*CSS*/
   @media all {
   }
   @media only screen and (min-width: 0px) {
   }
   @media only screen and (max-width: 0px) {
   }


   .Stil1 {color: #0000FF}
 


   .Stil1 {color: #0000FF}
   </style>

Alles anzeigen

Es geht um die h1 im Wort Fotografie. Sie hat momentan die gleiche Formatierung wie 'Herzlich willkommen' soll aber etwas anders sein (kleiner und evtl. andere Schriftart).

retnüg

und nun funktioniert es (schon pingelig, dieses html)

retnüg

Also so sieht es auf dem Server aus:
Es kann höchstens sein, dass es am rootverzeichnis meines Servers liegt, denn ich habe beide Seiten auf demselben Server (werde mal den Admin des Servers kontaktieren).

retnüg

Dann versuche ich es mal
hat funktioniert.

- - - Aktualisiert - - -

Leider bei meiner zweiten Website nicht (http://www.malerei2000.de)
Dazu der Quelltext vorher:

HTML

<!DOCTYPE html>
<html lang="de">
<head>
   <meta charset="utf-8">
   <title>Malerei2000</title>
   <meta name="description"Der Autor gibt Einblick in sein künstlerisches Schaffen;Malerei, Acrylmalerei Aquarelle "Platzhalter - Ein kurze Beschreibung des Inhalts in Satzform">
    <meta name="Keywords" content=Malerei, Acryl, Aquarelle>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <!-- <link href="../css/zentrale.css" rel="stylesheet"> -->

   <style>


   /*Icon-Font - font-family: 'FontAwesome';*/
   @import url(http://fontawesome.io/assets/font-awesome/css/font-awesome.css);


   /*Überschriften - font-family: 'Roboto Slab', Serif;*/
   @import url(https://fonts.googleapis.com/css?family=Roboto+Slab);


   /*Fließtext - font-family: 'Roboto', Sans-Serif";*/
   @import url(https://fonts.googleapis.com/css?family=Roboto);


   /*Zahlen* - font-family: 'Merriweather';*/
   @import url(https://fonts.googleapis.com/css?family=Merriweather);


 
   /*Icon-Font - font-family: 'FontAwesome';*/
   @import url(http://fontawesome.io/assets/font-awesome/css/font-awesome.css);


   /*Überschriften - font-family: 'Roboto Slab', Serif;*/
   @import url(https://fonts.googleapis.com/css?family=Roboto+Slab);


   /*Fließtext - font-family: 'Roboto', Sans-Serif";*/
   @import url(https://fonts.googleapis.com/css?family=Roboto);


   /*Zahlen* - font-family: 'Merriweather';*/
   @import url(https://fonts.googleapis.com/css?family=Merriweather);


   /*Basisangaben*/
   @media all {
      header, nav, main, aside, footer, section, article, figure, figcaption, audio, video {
         display: block;
      }
      * {
         /*box-sizing: border-box;*/
         min-width: 1px;
      }
      html {
      }
      body {
         padding: 1rem 0.5rem 2rem 0.5rem;
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*Schriften*/
   @media all {
      html {
         font-family: sans-serif;
         font-size: 120%;
         line-height: 1.3;
      }
      h1 {
         font-family: 'Felix titling', serif;
         font-size: 2.3rem;
         color: #2233dd;
         letter-spacing: 0.1rem;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      h2, h3, h4, h5, h6 {
         font-family: 'Roboto Slab', serif;
         font-size: 1rem;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      p, li, dl, dt, address {
         font-family: Roboto, sans-serif;
         font-size: 1rem;
         font-style: normal;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      a {
         /*darkblue*/
         color: hsla(240, 100%, 27%, 1);
         text-decoration: none;
         outline: none;
         margin: 0rem 0rem 0rem 0rem;
      }
      figcaption {
         font-family: Roboto, sans-serif;
         font-size: 0.9rem;
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*Grafiken*/
   @media all {
      figure {
         min-width: 1px;
         max-width: 100%;
         min-height: 1px;
         margin: 0,1rem;
      }
      img {
         min-width: 1px;
         display: block;
         max-width: 100%;
         /*max-height: 100vh;*/
         border: 0;
      }
   }


   /*Listen dl*/
   @media all {
      dl {
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      dt,
      dd {
      }
      dt {
         font-weight: bold;
         margin: 0rem 0rem 0rem 0rem;
      }
      dd {
         margin: 0rem 0rem 1rem 0rem;
      }
      dd p {
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*body*/
   @media all {
      body {
      }
   }
   @media only screen and (min-width: 1000px) {
      body {
         display: flex;
         flex-wrap: wrap;
         justify-content: center;
      }
   }


   /*.pageheader*/
   @media all {
      .pageheader {
         background-color: #97FFFF;
         border: 1px solid black;
      }
      .pageheader h1 {
         text-align: center;
       }
   }
   @media only screen and (min-width: 1000px) {
      .pageheader {
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 0rem - 2px - 0rem);
      }
   }


   /*.navigation*/
   @media all {
      .navigation ,.sidebar span.Stil1{
         background-color: #63B8FF;
         padding: 0.5rem;
         margin: 0.5rem 0rem;
      }
 .navigation p ,.sidebar span.Stil1{
         text-align: center;
      }
      .navigation a ,.sidebar span.Stil1 {
         color: #B22222;
         font-weight: bold;  
      }
   }
     a:hover{

}
   @media only screen and (min-width: 1000px) {
     .navigation a,.sidebar span.Stil1,
      .navigation a:visited {
         display: block;
         color:     #483d8b;
         font-weight: bold;
         padding: 0.3rem;
         border: 1px solid black;
         border-radius: 0.3rem;
      }
     .sidebar span.Stil1:hover{
        background-color: black;
         color: gold;

     }
      .navigation a:hover,
      .navigation a:active,
      .navigation a:focus {
         background-color: black;
         color: gold;
       }


   /*.content*/
   @media all {
      .content {
         background-color: #63B8FF;
         border: 2px solid black;
         padding: 0.5rem;
         margin: 0.5rem 0rem;
      }
      .content h2 {
         color: #FFFF33;
         text-align: center;
      }
      .content figure {
         max-width: 600px;
         margin: 0rem auto;
      }
   }
   @media only screen and (min-width: 1000px) {
      .content {
         margin: 0.5rem 1rem;
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 250px - 250px - 1rem - 2px - 2rem);
      }
   }


   /*.sidebar*/
   @media all {
      .sidebar {
         background-color: #63B8FF;
         color:    #483d8b;
          font-weight: bold;
         padding: 0.5rem;
         border: 2px solid #63B8FF;
         margin: 0.5rem 0rem;
      }
   }
   @media only screen and (min-width: 1000px) {
      .sidebar {
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(250px - 1rem - 4px - 0rem);
      }
   }


   /*.aktuellstesbild*/
   @media all {
      .aktuellstesbild {
         border: 2px solid black;
         padding: 0.5rem;
         margin: 0.5rem 0rem;
      }
      .aktuellstesbild h2 {
         text-align: center;
         font-weight: bold;
      }
      .aktuellstesbild figure {
         max-width: 600px;
         margin: 0rem auto;
      }
   }
   @media only screen and (min-width: 1000px) {
      .aktuellstesbild {
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 500px - 2rem - 1rem - 4px - 0rem);
      }
   }


   /*.pagefooter*/
   @media all {
      .pagefooter {
         padding: 0.5rem;
         border: 2px solid black;
         margin: 0.5rem 0rem;
      }
   }
   @media only screen and (min-width: 1000px) {
      .pagefooter {
         background-color: #97FFFF;
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 1rem - 4px - 0rem);
      }
   }


   /*Vorlagen zum Kopieren*/
   /*CSS*/
   @media all {
   }
   @media only screen and (min-width: 0px) {
   }
   @media only screen and (max-width: 0px) {
   }


   .Stil1 {color: #0000FF}
 


   .Stil1 {color: #0000FF}
   </style>
   <link rel="icon" type="image/vnd.microsoft.icon" href="www.malerei2000.de/palette.ico">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head>
<body>
   <header class="pageheader">
      <h1>Herzlich willkommen</h1>
   </header>
   <nav class="navigation">
      <p><a href="http://malerei2000.de/Malerei/Acrylmalerei/album/index.html">Acrylmalerei</a></p>
      <p><a href="http://malerei2000.de/Malerei/Aquarelle/album/index.html">Aquarelle</a></p>

     <p><a href="http://guenter-leipfinger.de/Kontakt.html">Kontakt</a></p>
      <p><a href="http://guenter-leipfinger.de/impressum.html">Impressum</a></p>
      <p><a href="http://gb.webmart.de/gb.cfm?id=1331502l" http:="" gb.webmart.de="">Gästebuch</a></p>
      <p>&nbsp;</p>
       <p><br><br><br>


        <script type="text/javascript" src="https://whomania.com/count/k3p"></script>


        <br>



      </p>


    </span></div>
     <div align="center"><span><p style="font-size:12pt;">Letzte Aktualisierung:</p>
  <!--?php echo date("d.m.Y, H:i:s",filectime("index.php"));
?-->
    <script type="text/javascript">
document.write(new Date().getDatenew Date().getMonth()+1)+"."+new Date().getFullYear())
  </script>20.2.2018<p></p>


      
   </span></div></nav>


      
   </nav>

   <main class="content">
      <h2>Malerei</h2>
      <figure>
        <div align="center"><img src="http://malerei2000.de/illusion.jpg" alt="Malerei"></div>
      </figure>

      <figure>
        <div align="center"></div>
      </figure>
      <footer class="contentfooter">      </footer>
   </main>
    <aside class="sidebar">
     Die Bilder können käuflich erworben werden.<span>Bei Interesse mail an den</span></p>
      <p><span><br>
      </span> <a href="http://guenter-leipfinger.de/Kontakt.html"><span class="Stil1">Künstler</span></p>
      </figcaption>
     </figure>
   </div>

</body>


</html>






</html>

Alles anzeigen

und nachher:

HTML

<!DOCTYPE html>
<html lang="de">
<head>
   <meta charset="utf-8">
   <title>Malerei2000</title>
   <meta name="description"Der Autor gibt Einblick in sein künstlerisches Schaffen;Malerei, Acrylmalerei Aquarelle "Platzhalter - Ein kurze Beschreibung des Inhalts in Satzform">
    <meta name="Keywords" content=Malerei, Acryl, Aquarelle>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <!-- <link href="../css/zentrale.css" rel="stylesheet"> -->
   <link rel="stylesheet" type="text/css" href="www.malerei2000.de/style2000.css"> 

   <link rel="icon" type="image/vnd.microsoft.icon" href="www.malerei2000.de/palette.ico">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head>
<body>
   <header class="pageheader">
      <h1>Herzlich willkommen</h1>
   </header>
   <nav class="navigation">
      <p><a href="http://malerei2000.de/Malerei/Acrylmalerei/album/index.html">Acrylmalerei</a></p>
      <p><a href="http://malerei2000.de/Malerei/Aquarelle/album/index.html">Aquarelle</a></p>

     <p><a href="http://guenter-leipfinger.de/Kontakt.html">Kontakt</a></p>
      <p><a href="http://guenter-leipfinger.de/impressum.html">Impressum</a></p>
      <p><a href="http://gb.webmart.de/gb.cfm?id=1331502l" http:="" gb.webmart.de="">Gästebuch</a></p>
      <p>&nbsp;</p>
       <p><br><br><br>


        <script type="text/javascript" src="https://whomania.com/count/k3p"></script>


        <br>



      </p>


    </span></div>
     <div align="center"><span><p style="font-size:12pt;">Letzte Aktualisierung:</p>
  <!--?php echo date("d.m.Y, H:i:s",filectime("index.php"));
?-->
    <script type="text/javascript">
document.write(new Date().getDatenew Date().getMonth()+1)+"."+new Date().getFullYear())
  </script>20.2.2018<p></p>


      
   </span></div></nav>


      
   </nav>

   <main class="content">
      <h2>Malerei</h2>
      <figure>
        <div align="center"><img src="http://malerei2000.de/illusion.jpg" alt="Malerei"></div>
      </figure>

      <figure>
        <div align="center"></div>
      </figure>
      <footer class="contentfooter">      </footer>
   </main>
    <aside class="sidebar">
     Die Bilder können käuflich erworben werden.<span>Bei Interesse mail an den</span></p>
      <p><span><br>
      </span> <a href="http://guenter-leipfinger.de/Kontakt.html"><span class="Stil1">Künstler</span></p>
      </figcaption>
     </figure>
   </div>

</body>


</html>






</html>

Alles anzeigen

die style2000.cs ist ebenso wie die index.html auf dem Server

Woran liegt es (wenn Du den Link aufrufst, siehst Du das Ergebnis)?

edit: soeben bemerke ich, dass ich bei der ersten Website gar nicht die verkleinerte index.html (ohne die Styleangaben) hochgeladen habe, sondern die frühere Version. Ich warte damit mal, bis Du den Fehler gefunden hast.

retnüg

Diese Datei benennen als

Zitat

stylesheet.css

?

retnüg

Zitat von Bandit

Vor gut einem Monat habe ich dir das geschrieben:

Wie kann man nur so beratungsresistent sein?!?!?

Hab ich doch versucht, hat aber nicht geklappt, da muß ich wohl was vom html-code mithineinbekommen haben.

retnüg

Danke für Deine Bemühungen, ich war aber so gestresst, dass ich lieber ein Backup genommen habe.

retnüg

Sry mir dreht sich schon der Kopf; wenn es Dir nicht zuviel ausmacht, bitte sage mir die Zeilen und was ich da ändern muß - bitte

retnüg

ehrlich gesagt nein, denn im Stylesheet ist doch für das ganze Dokument das festgelegt.

HTML

<!DOCTYPE html>
<html lang="de">
<head>
   <meta charset="utf-8">
   <title>Malerei und Fotografie</title>
   <meta name="description"Der Autor gibt Einblick in sein künstlerisches Schaffen; kunstvolle Fotografie "Platzhalter - Ein kurze Beschreibung des Inhalts in Satzform">
    <meta name="Keywords" content=Malerei, Acryl, Aquarelle, Fotografie, künstlerische Fotografie, Grusskarten, greeting cards>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <!-- <link href="../css/zentrale.css" rel="stylesheet"> -->

   <style>


   /*Icon-Font - font-family: 'FontAwesome';*/
   @import url(http://fontawesome.io/assets/font-awesome/css/font-awesome.css);


   /*Überschriften - font-family: 'Roboto Slab', Serif;*/
   @import url(https://fonts.googleapis.com/css?family=Roboto+Slab);


   /*Fließtext - font-family: 'Roboto', Sans-Serif";*/
   @import url(https://fonts.googleapis.com/css?family=Roboto);


   /*Zahlen* - font-family: 'Merriweather';*/
   @import url(https://fonts.googleapis.com/css?family=Merriweather);


 
   /*Icon-Font - font-family: 'FontAwesome';*/
   @import url(http://fontawesome.io/assets/font-awesome/css/font-awesome.css);


   /*Überschriften - font-family: 'Roboto Slab', Serif;*/
   @import url(https://fonts.googleapis.com/css?family=Roboto+Slab);


   /*Fließtext - font-family: 'Roboto', Sans-Serif";*/
   @import url(https://fonts.googleapis.com/css?family=Roboto);


   /*Zahlen* - font-family: 'Merriweather';*/
   @import url(https://fonts.googleapis.com/css?family=Merriweather);


   /*Basisangaben*/
   @media all {
      header, nav, main, aside, footer, section, article, figure, figcaption, audio, video {
         display: block;
      }
      * {
         /*box-sizing: border-box;*/
         min-width: 1px;
      }
      html {
      }
      body {
         padding: 1rem 0.5rem 2rem 0.5rem;
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*Schriften*/
   @media all {
      html {
         font-family: sans-serif;
         font-size: 120%;
         line-height: 1.3;
      }
      h1 {
         font-family: 'Felix titling', serif;
         font-size: 2.3rem;
         color: #2233dd;
         letter-spacing: 0.1rem;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      h2, h3, h4, h5, h6 {
         font-family: 'Roboto Slab', serif;
         font-size: 1rem;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      p, li, dl, dt, address {
         font-family: Roboto, sans-serif;
         font-size: 1rem;
         font-style: normal;
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      a {
         /*darkblue*/
         color: hsla(240, 100%, 27%, 1);
         text-decoration: none;
         outline: none;
         margin: 0rem 0rem 0rem 0rem;
      }
      figcaption {
         font-family: Roboto, sans-serif;
         font-size: 0.9rem;
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*Grafiken*/
   @media all {
      figure {
         min-width: 1px;
         max-width: 100%;
         min-height: 1px;
         margin: 0,1rem;
      }
      img {
         min-width: 1px;
         display: block;
         max-width: 100%;
         /*max-height: 100vh;*/
         border: 0;
      }
   }


   /*Listen dl*/
   @media all {
      dl {
         margin: 0.5rem 0rem 0.5rem 0rem;
      }
      dt,
      dd {
      }
      dt {
         font-weight: bold;
         margin: 0rem 0rem 0rem 0rem;
      }
      dd {
         margin: 0rem 0rem 1rem 0rem;
      }
      dd p {
         margin: 0rem 0rem 0rem 0rem;
      }
   }


   /*body*/
   @media all {
      body {
      }
   }
   @media only screen and (min-width: 1000px) {
      body {
         display: flex;
         flex-wrap: wrap;
         justify-content: center;
      }
   }


   /*.pageheader*/
   @media all {
      .pageheader {
         background-color: #97FFFF;
         border: 1px solid black;
      }
      .pageheader h1 {
         text-align: center;
       }
   }
   @media only screen and (min-width: 1000px) {
      .pageheader {
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 0rem - 2px - 0rem);
      }
   }


   /*.navigation*/
   @media all {
      .navigation ,.sidebar span.Stil1{
         background-color: #63B8FF;
         padding: 0.5rem;
         margin: 0.5rem 0rem;
      }
 .navigation p ,.sidebar span.Stil1{
         text-align: center;
      }
      .navigation a ,.sidebar span.Stil1 {
         color: #B22222;
         font-weight: bold;  
      }
   }
     a:hover{

}
   @media only screen and (min-width: 1000px) {
     .navigation a,.sidebar span.Stil1,
      .navigation a:visited {
         display: block;
         color:     #483d8b;
         font-weight: bold;
         padding: 0.3rem;
         border: 1px solid black;
         border-radius: 0.3rem;
      }
     .sidebar span.Stil1:hover{
        background-color: black;
         color: gold;

     }
      .navigation a:hover,
      .navigation a:active,
      .navigation a:focus {
         background-color: black;
         color: gold;
       }


   /*.content*/
   @media all {
      .content {
         background-color: #63B8FF;
         border: 2px solid black;
         padding: 0.5rem;
         margin: 0.5rem 0rem;
      }
      .content h2 {
         color: #FFFF33;
         text-align: center;
      }
      .content figure {
         max-width: 600px;
         margin: 0rem auto;
      }
   }
   @media only screen and (min-width: 1000px) {
      .content {
         margin: 0.5rem 1rem;
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 250px - 250px - 1rem - 2px - 2rem);
      }
   }


   /*.sidebar*/
   @media all {
      .sidebar {
         background-color: #63B8FF;
         color:    #483d8b;
          font-weight: bold;
         padding: 0.5rem;
         border: 2px solid #63B8FF;
         margin: 0.5rem 0rem;
      }
   }
   @media only screen and (min-width: 1000px) {
      .sidebar {
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(250px - 1rem - 4px - 0rem);
      }
   }


   /*.aktuellstesbild*/
   @media all {
      .aktuellstesbild {
         border: 2px solid black;
         padding: 0.5rem;
         margin: 0.5rem 0rem;
      }
      .aktuellstesbild h2 {
         text-align: center;
         font-weight: bold;
      }
      .aktuellstesbild figure {
         max-width: 600px;
         margin: 0rem auto;
      }
   }
   @media only screen and (min-width: 1000px) {
      .aktuellstesbild {
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 500px - 2rem - 1rem - 4px - 0rem);
      }
   }


   /*.pagefooter*/
   @media all {
      .pagefooter {
         padding: 0.5rem;
         border: 2px solid black;
         margin: 0.5rem 0rem;
      }
   }
   @media only screen and (min-width: 1000px) {
      .pagefooter {
         background-color: #97FFFF;
         flex-grow: 0;
         flex-shrink: 0;
         flex-basis: calc(100% - 1rem - 4px - 0rem);
      }
   }


   /*Vorlagen zum Kopieren*/
   /*CSS*/
   @media all {
   }
   @media only screen and (min-width: 0px) {
   }
   @media only screen and (max-width: 0px) {
   }


   .Stil1 {color: #0000FF}
 


   .Stil1 {color: #0000FF}
   </style>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head>
<body>
   <header class="pageheader">
      <h1>Herzlich willkommen</h1>
   </header>
   <nav class="navigation">
      <p><a href="http://malerei2000.de/Malerei/Acrylmalerei/album/index.html">Acrylmalerei</a></p>
      <p><a href="http://malerei2000.de/Malerei/Aquarelle/album/index.html">Aquarelle</a></p>
     <p><a href="http://guenter-leipfinger.de/Kontakt.html">Kontakt</a></p>
      <p><a href="http://guenter-leipfinger.de/impressum.html">Impressum</a></p>
      <p><a href="http://gb.webmart.de/gb.cfm?id=1331502l" http:="" gb.webmart.de="">Gästebuch</a></p>
      <p><a href="http://mitglieder.ecard-service.net/uebersicht.php?account=malerei" >Grußkarten</a></p>
       <p><br><br><br>


        <script type="text/javascript" src="https://whomania.com/count/k3p"></script>


        <br>


        


      </p>


    </span></div>
     <div align="center"><span><p style="font-size:12pt;">Letzte Aktualisierung:</p>
  <!--?php echo date("d.m.Y, H:i:s",filectime("index.php"));
?-->
    <script type="text/javascript">
document.write(new Date().getDatenew Date().getMonth()+1)+"."+new Date().getFullYear())
  </script>20.2.2018<p></p>


      
   </span></div></nav>


      
   </nav>

   <main class="content">
     <h2>&nbsp;</h2>
     <h2>&nbsp;</h2>
     <h2>Malerei</h2>
     <figure>
        <div align="center"><img src="http://guenter-leipfinger.de/illusion.jpg" alt="Malerei"></div>
      </figure>

      <footer class="contentfooter">      </footer>
   </main>
   <aside class="sidebar">
     <p><a href="http://guenter-leipfinger.de/Kontakt.html">Die Bilder können käuflich erworben werden.Bei Interesse mail an den</span></</p></a>


      <p><span><br>
      </span><span class="Stil1">Künstler</span></p>
</aside>



</body>


</html>

Alles anzeigen

retnüg

Hallo,
auf der Website http://www.guenter-leipfinger.de

ist auf der rechten Seite (scrennshot) ein Link zum Kontaktformular; doch beim Überfahren mit der Maus ist der Hovereffekt anders als beim Menü links.
Was ist der Grund?

retnüg

Ich danke Dir auf alle Fälle für Deine Unterstützung und wertvollen Tipps. Ich bin eben mehr auf künstlerischem Gebiet tätig. Nun gut Ding will Weile haben und irgendwann kann ich das auch, ist nur eine Frage der Zeit.

retnüg

Ist verstanden, trotzdem bleibt der Text nicht in der Mitte, wenn ich das align="center" entferne und wenn ich das   lösche, klappt es auch nicht.

retnüg

ich habe doch die css-Steuerung von center

HTML

/*.navigation*/
   @media all {
      .navigation {
         background-color: #63B8FF;
         padding: 0.5rem;
         margin: 1.rem 0rem;
      }
      .navigation p {
         text-align: center;

retnüg

Nun dass der Text zentriert ausgerichtet wird, aber was hat das mit dem Abstand zu tun?

retnüg

Danke für den Hinweis. Noch was: mir gefällt der große Abstand zwischen den Menüpunkten nicht besonders, sehe aber keine Möglichkeit, den zu verkleinern. In der index.html ist es besser. Aber wie kann ich das Menü hier verkürzen?

retnüg

Sorry, hast ja Recht, es dauert eben noch, bis ich in CSS fit bin - DANKE für Deinen Hinweis

Beiträge von retnüg

Wo kann ich die Schriftart einstellen?

Wo kann ich die Schriftart einstellen?

Wo kann ich die Schriftart einstellen?

Wo kann ich die Schriftart einstellen?

Wo kann ich die Schriftart einstellen?

Was ist hier falsch?

Was ist hier falsch?

Was ist hier falsch?

Was ist hier falsch?

Was ist hier falsch?

Was ist hier falsch?

Was ist hier falsch?

Was ist hier falsch?

Was ist hier falsch?

Wie muß der code lauten?

Wie muß der code lauten?

Wie muß der code lauten?

Wie muß der code lauten?

Wie muß der code lauten?

Wie muß der code lauten?