Autovalutazione.it by @Giozack - Codewith.it

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

Referenze

text/plainDefinisce un metodo di non codifica dei valori di un form
<th>Definisce una cella di intestazione di una tabella HTML.
multipleConverte in lista a selezione multipla
<h3>Titolo di intestazione di terzo livello
<cite>Inserisce citazioni e menzioni riguardo un'opera creativa.
<h5>Titolo di intestazione di quinto livello

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

JavaScript Debug Console

Progetti scolastici.html

La mia prima pagina html

ARKO - Artificial Intelligence Kno

Heads Or Tails Random Tally

Opla Materassi Napoli

Esercitazione n. 1(2)

HTML

CSS

JS

terminal console

feedback

add_box Nuovo

cookie Informativa

Informativa privacy e cookies

Utilizziamo cookie o tecnologie per finalità tecniche e, con il tuo consenso, anche per altre finalità come specificato nella cookie policy. Il rifiuto del consenso può rendere non disponibili alcune funzioni. Leggi di più sull'informativa privacy

Clicca su “Accetta” per acconsentire.

<!DOCTYPE html>
<html>
<html lang="IT">

<head>
  <charset="UTF-8">
    <meta name="author" content="Giovanni Zaccardi">
    <meta name="keywords" content="form, autovalutazione, test, html, css, javascript">
    <title>
      Autovalutazione.it
    </title>
    <link rel="stylesheet" href="C:/Users/giova/Desktop/SCUOLA/html/esercizio3.css">
    <script src="/javascript/autovalutazione.js" type="text/javascript"></script>
</head>

<body>
  <header>
    <h1>Questionario di autovalutazione</h1>
  </header>

  <fieldset>
    <legend>Informazioni personali</legend>
    <ul>
      <li><label for="nome">Nome</label><input type="text" id="nome" size="40" maxlenght="40" required=""></li>
      <li><label for="cognome">Cognome</label><input type="text" id="cognome" size="40" maxlenght="40" required=""></li>
      <li><label for="email">Email</label><input type="email" id="email" name="email" size="40" maxlength="40" required="">
      </li>
      <li><label>Inserisci la tua età</label><input id="eta" name="eta" type="number" placeholder="" min="13" max="30" required="">
      </li>
      <li><label>Anno di appartenenza classe</label><input id="clsse" name="expiry" type="number" placeholder="5" min="1" max="5" required="">
      </li>
      <h4>I dati personali saranno utilizzati solo a scopo di valutazione del soggetto e statistica in base alla classe
        di appartenenza</h4>
    </ul>
  </fieldset>

  <h1>Ora compila il questionario!</h1>
  <fieldset>SEZIONE COMPETENZE TRASVERSALI</fieldset>
  <fieldset>

    <p>Quali competenze credi di aver sviluppato durante il pcto?</p>
    <ul>
      <li><input type="checkbox" id="problemsolving" required=""> <label for="problemsolving">Problem solving</label>
      </li>
      <li><input type="checkbox" id="leadership" required=""> <label for="leadership">Leadership</label></li>
      <li><input type="checkbox" id="comunicazione" required=""> <label for="comunicazione">Comunicazione</label></li>
      <li><input type="checkbox" id="empatia" required=""> <label for="empatia">Emaptia</label></li>
      <li><input type="checkbox" id="flessibilità" required=""> <label for="flessibilità">Flessibilità</label></li>
      <li><input type="checkbox" id="gdc" required=""> <label for="gsc">Gestione dei conflitti</label></li>
    </ul>
  </fieldset>
  <fieldset>
    <legend>Gestione del tempo</legend>
    <p>Durante il PCTO in che modo hai re-suddiviso la tua giornata tipo?</p>
    <form>
      <label for="giornata"></label><textarea id="risp" cols="45" rows="12"></textarea></li>
    </form>
    <br>
    <br>
    <p>Quante stelle ti daresti da 1 a 5 per il tuo Time Managment?</p>
    <label for="n2"></label>
    <select name="n1" id="n1">
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
   </select>
    <br>
    <p>Riesci a rispettare le scadenze imposte durant el'esperienza di PCTO?</p>
    <form action="">
      <input type="radio" id="si" name="risp" value="si">
      <label for="si">Si</label>
      <input type="radio" id="no" name="risp" value="no">
      <label for="no">No</label>
      <input type="radio" id="inp" name="risp" value="inp">
      <label for="inp">In parte</label>
    </form>
    <br>
    <p>Spiega la tua risposta</p>
    <label for="richieste"></label><textarea id="risp" cols="45" rows="12"></textarea></li>
  </fieldset>
  <fieldset>
    <legend>Autoriflessione</legend>
    <p>In conculusione della tua esperienza, credi di aver imparato nuovi argomenti?</p>
    <form action="">
      <input type="radio" id="si" name="risp" value="si">
      <label for="si">Si</label>
      <input type="radio" id="no" name="risp" value="no">
      <label for="no">No</label>
      <input type="radio" id="inp" name="risp" value="inp">
      <label for="inp">In parte</label>
    </form>
    <br>
    <br>
    <p>Faresti di nuovo un’esperienza PCTO??</p>
    <form action="">
      <input type="radio" id="si" name="risp" value="si">
      <label for="si">Si</label>
      <input type="radio" id="no" name="risp" value="no">
      <label for="no">No</label>
      <input type="radio" id="inp" name="risp" value="inp">
      <label for="inp">In parte</label>
    </form>
    <p>Ora rifletti sulle tue azioni e alle tue nuove scelte, cosa faresti pe rmigliorare te stesso in un'azienda in un
      fututo?
    <form>
      <label for="giornata"></label><textarea id="risp" cols="45" rows="12"></textarea></li>
    </form>
    </p>
  </fieldset>
  <fieldset>
    <legend></legend>
    <h4>Dacci un feedback</h4>
    <form>
      <label for="giornata"></label><textarea id="risp" cols="45" rows="12"></textarea></li>
    </form>
    <p>I tuoi dati verranno trattati secondo le regole vigenti, di conseguenza utilizzeremo queste informazioni solo a
      scopi statistici, dopo essa cancelleremo ogni tuo dato personale</p>
  </fieldset>
  <div><input class="pulsante" type="submit" value="Invia"><input class="pulsante" type="reset" value="Reset"></div>
  <br>
  <footer>
    <p>Giovanni Zaccardi</p>
  </footer>





</html>


/* Stile generale per il body */
body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    background-color: #afb074;
    color: #333;
    padding: 20px;
}

/* Stile per l'intestazione */
header {
    text-align: center;
    margin-bottom: 30px;
    background-color: #afb074

}

/* Stile per il titolo dell'intestazione */
header h1 {
    font-family: Arial, sans-serif;
    color: #000000;
}

/* Stile per i fieldset */
fieldset {
    text-align: left;
    margin-bottom: 20px;
    border: 2px solid #ccc;
    border-radius: 10px;
    padding: 25px;
    background-color: #f5f5dc;
}

/* Stile per il legend */
legend {

    font-weight: bold;
}

/* Stile per gli input di testo */
input[type="text"], input[type="email"], input[type="number"], textarea {
    width: 100%;
    padding: 8px;
    margin-bottom: 10px;
    border: 1px solid #545151;
    border-radius: 4px;
    box-sizing: border-box;
}

li{
    list-style: none;/* che succede se impostiamo radial-gradient o japanese-formal o disc o circle none */
    margin-right: 10px;
}


/* Stile per i radio button */
input[type="radio"] {
    margin-right: 10px;
}

/* Stile per i pulsanti */
input[type="submit"], input[type="reset"] {
    background-color: #4CAF50;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin-right: 10px;
}

/* Stile per il footer */
footer {
    text-align: center;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #ccc;
}