them in the opposite order you opened them. <p> <h1>Some text</h1> <em>Some more text</em> Even more text. </p> Good <p> <h1>Some text <em>Some more text</h1> Even more text.</em> </p> Bad
<body> <h1>A heading</h1> <p>Any old content</p> </body> </html> Doctype Tells the browser which version of HTML we are using. In this case, we tell the browser HTML5 is being used.
<body> <h1>A heading</h1> <p>Any old content</p> </body> </html> HTML element The HTML element, or ‘root’ element. Defines the beginning and end of an HTML document.
<body> <h1>A heading</h1> <p>Any old content</p> </body> </html> head element The head element contains metadata about the document. For example the title of the page, links to scripts and links to stylesheets.
<body> <h1>A heading</h1> <p>Any old content</p> </body> </html> title element The title element define the title of the document. This is what will be shown in the browser’s title bar.
<body> <h1>A heading</h1> <p>Any old content</p> </body> </html> body element The body element holds the main content of the page. All content that will be shown on the web is contained in here.
are used to describe a section of content, and the numbers indicate importance. <h1>Most important</h1> ... <h6>Least important</h6> Headings are not meant to be used to simply re-size a portion of text.
a portion of text differently – normally in bold type – but doesn’t convey any meaning. For example you could use it to highlight the key word in a sentence: These slides talk about how to create <b>HTML</b> content. These slides talk about how to create HTML content.
<b> element , as it is intended to give importance to text, as well as display in bolder type. This is a <strong>very dangerous</strong> activity. This is a very dangerous activity.
a piece of text in the style of code. We need to use an <code><h1></code> tag there, it needs more importance. We need to use an <h1> tag there, it needs more importance.
an <a> tag. The destination of the link is set using the href attribute. The title attribute is used Follow us on <a href=“http://twitter.com”>Twitter</a> Follow us on Twitter.
the same document, by prefixing the anchor name with a hash (#). Find our <a href=“#contact”>contact</a> details at the bottom of the page. Find our contact details at the bottom of the page.
use the <img> tag. There are two required attributes; src which specifies the path to the image, and alt, which allows you to set some alternate text to be displayed if the image can’t be found. <img src=“/path/to/your/image.jpg” alt=“My picture” /> The <img> element is self-closing, in other words it doesn’t require a clsoing tag.
display a collection of items that don’t need numerical ordering. They are typically displayed with bullets. <ul> <li>Cheese</li> <li>Bread</li> <li>Milk</li> </ul> • Cheese • Bread • Milk
display a collection of items in numerical order. They are typically displayed with numbers or letters. <ol> <li>First</li> <li>Second</li> <li>Third</li> </ol> 1. First 2. Second 3. Third
is quoted from another source. If this is a web address, the cite attribute can be used to reference the source. <blockquote cite=“http://website.com”> <p>This paragraph is a quotation from another source.</p> </blockquote> The way this displays is dependent on your stylesheet, but typically the paragraph would be indented.
zozotech
ueokande
yusukeshimizu
pei0804
kotominaga
sansan_randd
oracle4engineer
sagara
akkiesoft
linedevth
akahane92
jacobian
deanohume
brettharned
lara
kneath
yeseniaperezcruz
rmw
tammyeverts
sergeychernyshev
trallard
destraynor
orderedlist
