1st project by @tywilliams7 - Codewith.it

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

References

<label>Mostrare un testo di etichetta per un elemento di input.
checkedPre-imposta su 'true' il valore di un elemento input checkbox o radio
<q>Indica una parte di testo come citazione breve
srcIndica la provenienza di una risorsa esterna (tramite URL).
<abbr>Inserisce abbreviazioni e acronimi
headersDetermina la relazione tra celle e celle di intestazione di una tabella.

Users

Log in to search for users

Explore

Find inspiration

inserimento immagini in un testo

Pagina HTML prova

Curriculum HTML

Titolo della Pagina

Meraviglie d\'Italia

Heads Or Tails Random Tally

Questa è una pagina dimostrativa

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.

 <h1>The Weather App</h1>

    <form>
      <div class="overflow-container">

      <input list="locations" type="text"  placeholder="Enter City" class="locationInput">
        
      <datalist id="locations">
        <option value="Phoenix"></option>
        <option value="Miami"></option>
        <option value="Denver"></option>
        <option value="Los Angeles"></option>
        <option value="Baton Rouge"></option>
          <option value="Chicago"></option>
          <option value="Little Rock"></option>
          <option value="Oklahoma City"></option>
          <option value="Nashville"></option>
          <option value="Salt Lake"></option>
          <option value="Columbus"></option>
          <option value="Newport"></option>
          <option value="Brooklyn"></option>
          <option value="Boston"></option>
          <option value="Hartford"></option>
      </datalist>

  
      <button class="button2">Enter</button>
    </form>

    <div class="weatherOutput">
      <div class="weatherIcon">
      <div class="weatherResults"></div>

      <div class="weatherconditons"></div>
      <div class="weatherTemp"></div>
    </div>

body {
  background-image: url("https://www.freestepdodge.com/attachments/03fcd68e5673f08be96d2b6bb5be8261-gif.27647/");
  background-repeat: no-repeat;
  background-size: 100%;
  margin:0%;
  padding:50%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.videoBg {
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: 1;
  object-fit: cover;
}

.main {
  position: relative;
  z-index: 100;
}

body {
  background-size: cover;
}

.overflow-container {
  display: flex;
  justify-content: space-around;
}

.weather {
  overflow: auto;
  position: relative;
}

.heavy-rain {
  overflow: hidden;
  position: absolute;
  top: 50px;
  left: 20px;
}

.Sunny-Weather  {
    position: fixed;
    top: 10px;
    right: 10px;
    
}