Nwlapcug.com


Come generare una griglia di colore

Gli sviluppatori Web creare pagine Web utilizzando un linguaggio chiamato HTML. Tabelle HTML consentono di creare griglie. Queste griglie, composta da righe e colonne, possono contenere informazioni quali numeri e testo. Griglie hanno anche proprietà di colore. Se avete bisogno di visualizzare una griglia contenente colori, puoi creare una tabella HTML e impostare il colore di sfondo di ogni cella di un colore diverso.

Istruzioni

1

Aprire il blocco note e creare un nuovo documento.

2

Inserire il codice riportato di seguito nel documento. Questo codice genera una griglia di colore creando una tabella con celle e impostazione del colore di ogni cella.

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional / / EN" "l'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html >

< head >

< title > colore griglia < / title >

< script type = "text/javascript" >

onLoad = function () {

IMPOSTARE QUESTI TRE VALORI

righe di var = 5;

colonne di var = 5;

colori var = [

"red", "green", "blue", "yellow", "WhiteSmoke", "black",

"Brown", "Coral", "Crimson", "DarkRed", "DarkSlateBlue",

"DeepPink", "DeepSkyBlue", "DimGray", "DodgerBlue", "FireBrick",

"HotPink", "Ivory", "Lavender", "Lime", "Maroon", "PowderBlue",

"Plum", "PaleTurquoise", "navy"

];

var colorCount = 0;

cellHeight var = "40px";

var cellWidth = "40px";

tabella di var = document.getElementById("table1");

tableBody var = document.createElement('tbody');

per (var i = 0; i < righe; i + +) {

riga var = document.createElement('tr');

per (var j = 0; j < colonne; j + +) {

var tableCell = document.createElement('td');

tableCell.style.backgroundColor = "transparent";

tableCell.style.backgroundColor = colors[colorCount];

tableCell.style.height = cellHeight;

tableCell.style.width = cellWidth;

colorCount++;

tableCell.appendChild(document.createTextNode(' '))

row.appendChild(tableCell);

}

tableBody.appendChild(row);

}

table.appendChild(tableBody);

}

< / script >

< / head >

< corpo >

< id tabella = "table1" >< / tabella >

< / body >

< / html >

3

Individuare la riga che legge "Di questi tre valori." Troverete il seguente codice sotto tale riga:

righe di var = 5;

colonne di var = 5;

In questo esempio, la griglia conterrà cinque righe e cinque colonne perché i valori per le righe e le colonne sono 5 e 5. Impostare questi valori a qualcosa che ti piace. Ad esempio, se si desidera una griglia di colore con tre righe e due colonne, modificare il codice in modo che legge:

righe di var = 3;

var colonne = 2;

Individuare la riga di codice che legge "colori var =." Questa linea definisce i colori nella griglia. Come mostrato nell'esempio, quei colori sono rosso, verde, blu e altre 22 persone.

4

Organizzare tali colori come più che ti piace. Verranno visualizzati in questo ordine quando si visualizza la griglia di colore. Per esempio, se si desidera verde a comparire dinanzi a rosso nella griglia, è possibile inserire verde prima rosso nella stringa di definizione di colore. Essere sicuri di circondano ogni colore con le virgolette, come illustrato nell'esempio. È anche possibile sostituire quei colori con i colori della vostra scelta. È possibile selezionare da colori da un totale di 147 colori HTML.

5

Fare clic su "File" e selezionare "Salva come". Si apre una finestra che ti permette di salvare il documento come un file HTML.

6

Digitare xyz.html nella casella di testo "Nome File". Sostituire "xyz" con qualsiasi nome che ti piace. Per esempio, se si desidera il nome "MyColorTable", digitare MyColorsTable.html nella casella di testo.

7

Fare clic su "Salva" per salvare il file. Aprire Esplora risorse e individuare il file. Fare doppio clic su esso. Il tuo browser per aprire e visualizzare la griglia di colore. Per utilizzare questa tabella online, caricarlo sul server web.