Microsoft Expression Web - Layout HTML

In questo capitolo impareremo un altro modo di progettare il layout di una pagina. Nell'ultimo capitolo, abbiamo usato il foglio di stile per applicare gli stili a intestazione, piè di pagina, ecc. Ma puoi anche specificare gli stili nella stessa pagina HTML senza usare un foglio di stile aggiuntivo.

Questo non è il modo consigliato per progettare un layout, tuttavia, solo per scopi di comprensione, tratteremo questa tecnica qui. Prova a seguire i passaggi indicati di seguito.

Step 1 - Aggiungiamo una pagina HTML e chiamiamola layoutdemo.html

Step 2 - Ora aggiungi il file <div> tag dalla casella degli strumenti.

Step 3 - Nel Apply Styles pannello, fare clic sul file New Style…

Step 4- Quando selezioni l'opzione Pagina corrente dal menu a discesa "Definisci in", lo stile verrà salvato nella stessa pagina HTML. Imposta il carattere per la tua pagina e poi vai alla categoria Sfondo.

Step 5- Imposta il colore per lo sfondo. È inoltre possibile impostare le categorie Bordo, Riquadro e Posizione e quindi fare clic su OK.

layoutdemo.html

Puoi vedere che lo stile viene aggiunto nello stesso file HTML.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns = "http://www.w3.org/1999/xhtml">  
   <head> 
      <meta content = "text/html; charset = utf-8" http-equiv = "Content-Type" /> 
      <title>Untitled 1</title> 
      <style type = "text/css">
         #container { 
            font-family: Arial, Helvetica, sans-serif; 
            font-size: medium; 
            font-weight: normal; 
            font-style: normal; 
            font-variant: normal; 
            text-transform: capitalize; 
            color: #800000; 
            background-color: #C0C0C0; 
            padding: 8px; 
            margin: 8px; 
            width: 90%; 
         } 
      </style> 
   </head>  

   <body> 
      <div id = "container"></div> 
   </body> 
</html>

Allo stesso modo, puoi aggiungere altri stili come intestazione, piè di pagina, contenuto principale, ecc. Come mostrato sopra.