Salve a tutti apro un nuovo topic per porvi una domanda...
come faccio a inserire un immagine di sfondo hostata su un sito altervista come sfondo sulla pagina web di arduino? (pagine nel suo webserver)
MI avete capito
Dicono di usare CSS ma non avete qualche esempio?
io ho questo sketch
 client.println("HTTP/1.1 200 OK");
    client.println("Content-Type: text/html");
    client.println();
    client.print("<html><head><title>ARDUINO Controllo via WEB</title><meta http-equiv='Content-Type' content='text/html; charset=iso-8859-1' ></head><body>");
   Â
    //PORTONE CASA
    client.println("<hr />");
    client.println("<h1>Portone Casa</h1>");
    client.println("
");
    //STAMPA STATO OPERAZIONE
    client.print("<span>ESEGUITO: </span>");
     if (PORTONE) {
       client.println("<span style='color:green'>SI</span>");
      }
      else
      {
       client.println("<span style='color:grey'>NO</span>");
     }
    client.print("<h2><a href='/?L=1'>APRI</a>");
   Â
    client.println("<hr />");
   Â
    //Secondo led
    client.println("<h1>LED2</h1>");
    client.println("
");
    //printing LED status
    client.print("<span>STATO LED: </span>");
     if (LED2ON) {
       client.println("<span style='color:green'>ON</span>");
      }
      else
      {
       client.println("<span style='color:grey'>OFF</span>");
     }
    client.print("<h2><a href='/?L=2'>ON</a> | <a href='/?L=02'>OFF</a></h2>");
    client.println("<hr />");
   Â
    //terzo led
    client.println("<h1>LED3</h1>");
    client.println("
");
    //printing LED status
    client.print("<span>STATO LED: </span>");
     if (LED3ON) {
       client.println("<span style='color:green'>ON</span>");
      }
      else
      {
       client.println("<span style='color:grey'>OFF</span>");
     }
    client.print("<h2><a href='/?L=3'>ON</a> | <a href='/?L=03'>OFF</a></h2>");
    client.println("</body></html>");
    //clearing string for next read
    readString="";
    //stopping client
    client.stop();
più che colorare il testo non posso fare...
mi fareste qualche esempio con le immagini di sfondo e il testo colorato?
Grazie
sistema pero' il tuo web server, quando lo refreshi ti da centinaia di pagine
Portone Casa
ESEGUITO: SI
APRI
LED2
STATO LED: OFF
ON | OFF
LED3
STATO LED: OFF
ON | OFF
dStatus, 400, btn, url); // }, // error: function(s, xhr, status, e) { //console.log("GettinHTTP/1.1 200 OK Content-Type: text/html
Portone Casa
ESEGUITO: SI
APRI
LED2
STATO LED: OFF
ON | OFF
LED3
pan>ESEGUITO: SI
APRI
LED2
STATO LED: OFF
ON | OFF
LED3
STATO LED: OFF
ON | OFF
Portone Casa
ESEGUITO: SI
APRI
LED2
STATO LED: OFF
ON | OFF
LED3
STATO LED: OFF
ON | OFF
dStatus, 400, btn, url); // }, // error: function(s, xhr, status, e) { //console.log("GettinHTTP/1.1 200 OK Content-Type: text/html
Portone Casa
...............
............
stampi l'html della pagina, oltre che gli header, ovvero la parte con
client.println("HTTP/1.1 200 OK");
    client.println("Content-Type: text/html");
    client.println();
la cosa ideale è creare un file di testo col blocco note, scrivere l'thml della pagina, lavarlo come "file.HTML" e aprirlo con il browser. Quando la pagina sarà corretta, allor puoi mettrela sulla SD oppure metterla nelle clint.print(), anche se l'ultima soluzione a lungo andare è più sbatti.
ps. per il background
è HTML non CSS, e per le tabelle (sempre HTML) è
, ma queste te le devi studiare che non ricordo bene come fari righe e colonne.
Esistono anche dei programmi che semplificano la cosa, ma non mi è mai piaciuta lo stile di scrittura del codice che utilizzano
client.print("<html><head><title>ARDUINO Controllo via WEB</title><meta http-equiv='Content-Type' content='text/html; charset=iso-8859-1' ></head><body style='background: url(http://link-alla-tua-immagine)'>");
Ora che lo vedo, usa i doppi apici per gli attributi dei tag e come codifica sarebbe meglio usare UTF-8.
Le tabelle HTML non sono un concetto immediato, bisogna smanettarci un po' per capirle, comunque di base:
apri il tag e poi ,per ogni riga apri un ;
per ogni colonna devi aprire un
dentro a ogni riga;
quindi per fare una tabella 2 righe e 2 colonne: