SITO by @sara demme - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

References

<ol>Crea liste ordinate o numerate.
<q>Indica una parte di testo come citazione breve
<tbody>Definisce il contenuto principale di una tabella.
<source>Il tag HTML <source> si usa per indicare una o più risorse multimediali per elementi media
<i>Formatta il testo in corsivo/italico non enfatizzato
<link>Collega il documento corrente con una risorsa esterna

Users

Log in to search for users

Explore

Find inspiration

Open.js Framework

Ximena\'s hamburger

Design & Comunicazione Digitale ??

Riprova verifica di progr

Review of Functions I

02/02/24 Jajo talpa no gusta pelo

Un Giorno a Napoli: Itinerario Det

Esame di informatica

Quiz ristrutturazione

HTML

CSS

JS

terminal console

feedback

add_box New

cookie Policy

Privacy information and cookies

We use cookies or technologies for technical purposes and, with your consent, also for other purposes as specified in the cookie policy. Refusal of consent may make some functions unavailable. Read more about the privacy policy

Click on “Agree” to confirm.

<!DOCTYPE html>
<html>
 <head>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  
    <title>SITO</title>
</head>
<BODY>
  <nav>
        <ul>
            <li><a href="#">HOME</a></li>
            <LI><A href="#">KITCHEN</A></LI>
            <li><a href="#">LIVING</a></li>
            <li><a href="#">OUTDOOR</a></li>
            <LI><A href="#">NIGHT ZONE</A></LI>
            <li><a href="#">CONTACT</a></li>
        </ul>
    </nav>
<img src="https://www.villeecasali.com/wp-content/uploads/2016/10/Cucine-moderne-960x640.jpg">
<div id="button">
 <button>SCOPRI DI PIU</button>
</div>
<div>
  
  <h1>ARREDAMENTO E MOLTO ALTRO</h1>
 <P>
    Il generatore di testo pseudo-leggibile è utile per designer e progettisti di layout durante la compilazione di layout e siti di test. Questa tecnica consente di creare facilmente l'effetto di riempire il sito con contenuto di testo. Il testo fish o Lorem Ipsum è volutamente reso privo di significato logico in modo che l'utente possa concentrarsi sulla percezione visiva del layout. Questo generatore di testo sarà utile per designer e designer di layout che necessitano di testo casuale per riempire siti e layout. La generazione del testo viene eseguita in base al numero di paragrafi. Non dovresti usare il testo generato per progetti reali.
  </p>
</div>
<DIV> <h2> OUTDOOR</h2></DIV>
<div id="IMG">
  <img src= "https://mondodesign.it/wp-content/uploads/2017/03/Idee-Arredare-Giardino.jpg" id="img2">
  <img src= "https://mondodesign.it/wp-content/uploads/2017/03/Arredamento-Giardino-Pavimentato-03.jpg"id="img3">
</div>
<div>
<DIV id="CONTENITORE">
<p id="P2" class="STESSASEZIONE">
  Ci sono molti servizi sul web che creano testo casuale, una raccolta priva di significato di parole casuali che sembrano solo testo reale. Individualmente, ogni parola significa qualcosa, ma insieme si legge come eresia. Per ottenere un testo normale, le sostituzioni casuali da sole non sono sufficienti: sono necessarie reti neurali. 
</p>


  <P id="P3" class="STESSASEZIONE">
    Ci sono molti servizi sul web che creano testo casuale, una raccolta priva di significato di parole casuali che sembrano solo testo reale. Individualmente, ogni parola significa qualcosa, ma insieme si legge come eresia. Per ottenere un testo normale, le sostituzioni casuali da sole non sono sufficienti: sono necessarie reti neurali. 
  </P>
</div>
<div id="foter">
<p id="f1" class="fot">Ci sono molti servizi sul web che creano testo casuale, una raccolta priva di significato di parole casuali che sembrano solo testo reale. .
</p>
<p id="f2" class="fot">Ci sono molti servizi sul web che creano testo casuale, una raccolta priva di significato di parole casuali che sembrano solo testo reale.</p>
<p id="f3" class="fot">Ci sono molti servizi sul web che creano testo casuale, una raccolta priva di significato di parole casuali che sembrano solo testo reale. </p>






</div>













</BODY>




























</html>

*{
  margin: 0px;
  padding: 0px;
}

nav {
    background-color: #060606;
    opacity: 0.5;
    color: #fff;
    position: fixed;
    width: 100%;
    min-width: 200px;
    height: 80PX;
}

nav ul {
    list-style: none;
    padding: 20PX;
    margin: 0;
    display: flex;
    
}

nav li {
    margin-right: 40px;
    
}


nav a {
    text-decoration: none;
    color: #fff;
    font-weight: bold;
}
NAV A:hover{
  color:orangered;
  opacity: 1;
  transition:  3s 0.1s  ;
  cursor: pointer;

    
  }

IMG{ 
  width: 100% ;

}
BUTTON{
  text-align: center;
  width: 200PX;
  height: 50px;
  background-color: #060606;
  color: white;
  margin-top: 60px;
  }
BUTTON:HOVER{
  background-color: black;
  opacity: 0.7;
  color: white;
}
#button{
text-align: center;
}


H1{
  margin-top: 90PX;
  text-align: center;
  color: orangered;
  background-color: #060606;
  opacity: 0.7
   ;
}
P{
  padding: 50PX 150;
  line-height: 150%;
  margin-top: 0PX;
  
  background-color: #060606;
opacity: 0.7;
color: white;

}
h2{
  color: black;
  text-align: center;
  margin-top: 0px;
  font-size: 40PX;
  font-weight: bold;
  font-style: oblique;
 text-decoration: underline;
 float: none;
}

 
 #IMG{
  display: flex;
  justify-content: center;
  justify-content: space-around;
 }

#img2,#img3 {
 box-shadow: 1px 1px 50px black;
 width: 400px;
 margin-top: 40px;}
 #IMG2{margin-left: 50PX;

 }
 #IMG3{
  margin-right: 50px;
 }

P.STESSASEZIONE{
  background-color: orangered;
  opacity: 0.8;
   margin:50px 80px;
 padding: 40 60px;
 box-shadow:10PX 10PX 50PX #060606;
  
}
#P2{
  border:2PX solid #060606;
  
  
}
#P3{
border: 2px solid black;
}

#CONTENITORE{
  display: flex;
 
}
#foter {
  display: flex;
  height: 400PX;
}
#f1,#f2,#f3{
  padding: 140PX 80PX;

}
P.FOT:hover{
  color: orangered;
  
}