<h1>Capitolo 1</h1>
<p>Il mio primo paragrafo</p>
<p>Il mio secondo paragrafo</p>
<h2>sottotitolo1</h2>
<p>Il mio primo paragrafo</p>
<p id="myid">Il mio secondo paragrafo(id=myid)</p>
<p class="myclass">Il mio terzo paragrafo(class=myclass)</p>
Altri tag
Using Google Font ApiEsempio grassetto: <b>google</b> <strong>google</strong> CSS: font-style: bold;
Esempio corsivo: <i>google</i> <em>google</em> CSS: font-style: italic;
Esempio sottolineato: <u>google</u> <...>aaa<...> CSS: text-decoration: underline;
Esempio barrato:
<s>google</s>
<strike>google</strike>
CSS: text-decoration: line-through;
Esempio quotato:
<q>google
</q>
Esempio quotato: <blockquote>
Esempio testo inserito e cancellato (versioning):
My favorite color is <del>blue</del> <ins>red</ins>!
Esempio mark: Do not forget to buy <mark>milk</mark> today.
Esempio superscript: <sup>google</sup>
Esempio subscript: <sub>google</sub>
Esempio big(deprecated) & small: <big>my text</big> <small>my text</small>
Esempio citazione: <cite>Text citation</cite>
Esempio acronimo(deprecated): Can I get this <acronym>ASAP</acronym>?
Esempio abbreviazione: The <abbr>WHO</abbr> was founded in 1948
Esempio definizione: <dfn>HTML</dfn> is the standard markup language for creating web pages.
Esempio indirizzo email: <address>
email@address.it</address>Esempio testo preformattato: <pre>
Text is displayed in a fixed-width font, and it preserves both spaces and line breaks</pre>
Immagini, hyperlink
Esempio immagine:
<img src='...' alt='...' title='...'>
</img>
Esempio hyperlink: <a href='...' title='...'>google</a>
Esempio meter & progress:
- tt is deprecated in HTML5.
- If <tt> was used for marking up keyboard input, consider the <kbd>aa</kbd> element;
- for variables, consider the <var>aa</var> element;
- for computer code, consider the <code>
aa</code> element; - and for computer output, consider the <samp>aa</samp>
We open at every morning.
I have a date on .
Tabella
| aaa | bbb | ccc |
| column A | column B | |
|---|---|---|
| row(1) | cell(A1) | cell(B1) |
| row(2) | cell(A2) | cell(B2) |
| aaa | bbb | ccc |
CSS
w3schools/css- inline CSS
<body> <label style="color:blue;margin-left:30px;">This is a heading.</label> </body>
- internal CSS
<head> <style> body { background-color: linen; } h1 { color: maroon; margin-left: 40px; } label { background-color: blue; } label.style1 { background-color: blue; } .style2 { background-color: blue; } label#style3 { background-color: blue; } #style4 { background-color: blue; } </style> </head> <body> <label>ciao</label> <label class="style1">ciao</label> <label class="style2">ciao</label> <label id="style3">ciao</label> <label id="style4">ciao</label> </body> - external CSS
<head> <link rel="stylesheet" type="text/css" href="mystyles.css"> </head> <body> <label>ciao</label> <label class="style1">ciao</label> <label class="style2">ciao</label> <label id="style3">ciao</label> <label id="style4">ciao</label> </body>
- applying styles (use attribute class="..." or id="...")
- And at last... selectors:
- .intro: Selects all elements with class="intro"
- h1.intro: select all H1 elements with class="intro"
- div+p: Selects all p elements that are placed immediately after div elements
- div p: Selects all p elements inside div elements
- #lastname: The element with id="lastname"
- .intro,#lastname: All elements with class="intro", and the element with id="lastname"