Significato delle parentesi nei CSS

Autore: Judy Howell
Data Della Creazione: 26 Luglio 2021
Data Di Aggiornamento: 17 Novembre 2024
Anonim
CSS 3  Tutorial Italiano - Le basi dello sviluppo web
Video: CSS 3 Tutorial Italiano - Le basi dello sviluppo web

Contenuto

L'acronimo CSS deriva dall'inglese "cascading style sheets", o "cascading style sheets". I CSS offrono un maggior grado di controllo artistico e di design agli sviluppatori e ai progettisti di siti web separando il contenuto dai parametri di visualizzazione. Le istruzioni CSS sono posizionate nell'intestazione di un documento Web e quindi visualizzate all'interno del corpo della pagina Web da parentesi graffe - {}. All'interno delle parentesi graffe ci sono le parentesi - () - o parentesi - [] - che designano altri elementi CSS.


Le parentesi CSS vengono utilizzate all'interno del corpo di un documento Web (Comstock / Comstock / Getty Images)

chiavi

Le chiavi sono gli elementi principali della sintassi CSS. Significano l'apertura e la chiusura di tutti i parametri CSS contenuti al loro interno. Rappresentati come {}, seguono elementi CSS che indicano un'immagine, posizione, elemento di visualizzazione o qualsiasi combinazione di elementi. Le chiavi possono esistere all'interno di qualsiasi elemento / livello div e sono sempre all'interno dei tag "</ body>". Ecco un esempio:

div # example {padding: 5px; margine: 20px; larghezza: 350 px; }

parentesi

Gli elementi relazionali, come percentuali e colori, sono racchiusi tra parentesi. Le parentesi danno una definizione aggiuntiva agli elementi CSS. Nelle versioni CSS precedenti a CSS3, le parentesi potevano definire gli elementi allo stesso modo delle chiavi. Due esempi sono il colore (definito dal codice esadecimale) e le immagini di sfondo, rispettivamente:


color: rgb (128, 128, 255); immagine: url ("/ images / bg.png")

staffe

I brackets - [] -, noti come selettori di attributo, sono usati per designare i valori degli attributi di un elemento. C'erano quattro diversi valori nei CSS2 e sono stati aggiunti, ma tre con CSS3. I quattro selettori originali definiscono la presenza dell'attributo - [titolo], corrispondente a qualsiasi elemento che abbia un attributo "titolo" specificato; il valore dell'attributo semplice - input [type = "send"], corrispondente a qualsiasi elemento input il cui tipo di attributo è uguale a "send"; il valore dell'attributo list - p [class ~ = "literary"], corrispondente ai paragrafi il cui attributo class è un elenco di parole separate da spazi, uno dei quali è "letterario"; e valore attributo parziale - [href ^ = "http:"], corrispondente agli elementi di collegamento il cui valore di attributo inizia con "http:". Le parentesi non erano molto usate prima dell'introduzione di Internet Explorer 7, perché IE6 non le riconosceva.


Molti simboli algebrici sono usati come elementi CSS (BananaStock / BananaStock / Getty Images)

chevron

I selettori e le sezioni dei documenti HTML (Hypertext Markup Language) e Extensible Markup Language (XML) sono delimitati da parentesi graffe, note come chevron . Rappresentano anche un elemento figlio di alcuni elementi CSS. In CSS, un "selettore figlio" è composto da due o più elementi separati dal simbolo ">". Questi indicano alcune sezioni definite di una pagina Web: il corpo, che è la pagina visibile; gli strati, che possono essere impilati come fogli di carta uno sopra l'altro; o titolazione, che indica determinati oggetti o date noti come "microformati".

Note CSS

Separati da parentesi CSS, ma ancora un prezioso strumento organizzativo per elaborare layout CSS, sono fogli di stile. Si tratta di commenti che non aggiungono nulla al codice HTML e pertanto non aumentano il tempo di caricamento delle pagine; forniscono uno schema per CSS lunghi ed elaborati. Le note in CSS sono posizionate all'interno del loro attributo - / * - in questo modo:

/ Ogni commento è contenuto all'interno di segmenti delimitati da una barra e un asterisco. /

Possono essere estremamente utili per aiutarti a navigare in sezioni di fogli di stile a cascata.

I CSS possono aiutarti a progettare pagine per diverse dimensioni dello schermo senza creare layout separati (Comstock / Comstock / Getty Images)

riferimenti

  • "Mastery CSS: soluzioni avanzate per gli standard Web"; Andy Budd, et al .; 2009
  • Scuole W3: sintassi CSS
  • "The Ultimate CSS Reference"; Tommy Olsson, et al .; 2008

mezzi

  • W3C: selettori CSS [in inglese]
  • New2HTML: la sintassi dei CSS [in inglese]