Scribd
Upload
2 views

HTML Resume

The document provides an overview of HTML, including its structure through the Document Object Model (DOM) and various HTML tags for content organization such as paragraphs, lists, and forms. It also covers attributes, links, images, audio, video, and tables, detailing how to use them effectively. Additionally, it explains the significance of global attributes and responsive design for images and media elements.

Uploaded by

ellendeoliveira.netserv
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
2 views

HTML Resume

The document provides an overview of HTML, including its structure through the Document Object Model (DOM) and various HTML tags for content organization such as paragraphs, lists, and forms. It also covers attributes, links, images, audio, video, and tables, detailing how to use them effectively. Additionally, it explains the significance of global attributes and responsive design for images and media elements.

Uploaded by

ellendeoliveira.netserv
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 6

HTML

HyperText Markup Language


defines the content of a site.

DOM
(Document Object Model)
The hierarchy and structure of HTML elements, often used for targeting elements in CSS
and JavaScript

tags

<p> paragraphs
<h1> cabeçalho (vai até o 6)
<article> article
<small> small meaning (for copyright for example)
&nbsp; non-breaking space
<div> to create sections (block-level element)
<span>( inline element)
<main> wraps around the main content of the page
<header> wraps headers in the content
<footer> wraps footers in the content
<article> wrapped around any instance of an article
<section> wraps around sections of content
<aside> marks content that is off to the side or not the main attraction

bold and italics

<b> visual-only bold


<strong> importance, seriousness, urgency
<i> visual-only italics
<em> emphasis italics

lists

<ol> ordered list


<li> list item (inside the ol and ul lists)
<ul> unordered list
<df> definition list
<dt> definition term
<dd> definition description

quotes

<q>
<blockquote>
<cite>

dates and times

<time>

attribute:
<time datetime=”YYYY-MM-DD”>
“HH-MM-SS.DD”

code

<pre> pre formatted


<code> code
<br> break row

simbols

&lt; less than


&gt; greater than
&amp; &
&copy; copyright ©
&trade; tradebrand ™
&star; star

superscripts, subscripts, and small text

<sub> subscripts
<sup> superscripts

Attributes
global attributes
can be applied to any HTML element

● CLASS
<p class=”intro”>

● ID
<p class=”intro” id=”article-intro”>

● LANG (informa o idioma)


<p lang=”pt-br”>

● DIR (direction the text flows)


<p dir=”ltr”>

● ARIA ROLES (attributes that provide accessible information about that specific
element)
<h1 aria-label=”hello word”>
<div class=”grid” aria-hidden=”true”>
links

<a href=”https://example.com”>

images

<img scr=”image.jpg alt=”black dog” width=”300” height=”400”>

responsive images

<picture>
srcset=” , “
<img src=” ” alt=” “ width=” ” height=” “>
480 px => 960 px => 1440px => 1920px

audio

<audio controls loop src=” “ type=” “>

you can let a message for the user in case of any type of audio load.

you can use source element

video

<video>

can use the source element


the best way to use a video is input it from youtube.
explain it to your customer
.forms
name, email, password, search, phone number, text area, date, color, file, check box, select
list

<form action=”success.html” method=” “>

<label for name=”name”> name </label>


<input name=”name” id =”name” type=”text”>

<label for=”email”> email </label.


<input name=”email” id=”email” type=”email”
placeholder=”[email protected]”>

<label for=”password”> password</label>


<input id=”password” name=”password” type=”password”>

<label for=”search”> search </label>


<input name=”search” id=”search” type=”search”
placeholder=”&#$193050;” >

<label for=”phone”> phone number</label>


<input name=”phone” id=”phone” type=”tel”>

<label for=”textarea”> text area</label>


<textarea name=”textarea” id=”textarea” col=”30”
rows=”15”><//textarea>

<label for=”date”> date</label>


<input name=”date” id=”date” type=”date”>

<label for=”color”>color</label>
<input name=”color” id=”color” type=”color”>

<label for=”file”>file</label>
<input id=”file” name=”file” type=”file” accept=”image/*” multiple>

<label for=”checkbox”>checkbox</label>
<input name=”simplecheckbox” id=”checkbox” value=”the
checkbox is checked” type=”checkbox” checked>

<fieldset>
<legend> radio buttons in a fieldset</legend>
<input id=”thisradio” name=”radiobutton” type=”radio”
value=”this”>
<button type=”submit”> sign up </button>

table

<td> table data (marking up the content of each table cell)


<th> table header (to mark content that’s in a header)
<tr> table rows

You might also like