HTML Flashcards
<p></p>
creates a paragraph
<!-- -->
creates a comment
HTML attributes
special words used inside the opening tag of an element to control the element’s behavior
alt
if an image fails to load it will display a text instead
anchor (a) element
can link to another page using href
target= _blank
it is an anchor (a) element’s opening tag, so that the link opens in a new tab.
<ul> </ul>
unordered list
<li></li>
creates items inside of list
figure element
represents self-contained content and will allow you to associate an image with a caption.
<figcaption> </figcaption>
add a caption to describe the image contained within the figure element.
<em> </em>
this emphasizes text using italic
<ol> </ol>
list items in an ordered list are numbered when displayed.
<strong> </strong>
some text is of strong importance or urgent. in bold text
<form> </form>
web form to collect information from users.
action attribute
indicates where form data should be sent.
are input element self closing?
Yes
<input></input>
element allows you several ways to collect data from a web form.
type=”text”
Create a text field to get text input from a user
name attribute
a form’s data to be accessed in the action attribute
placeholder attribute
give people a hint about what kind of information to enter into an input
required attribute
prevents a user from submitting your form when required information is missing
type=”radio”
creates a check dot in an input element
<label> </label>
label elements are used to help associate the text for an input element with the input element itself(especially for assistive technologies like screen readers).
id attribute
used to point to a specific style declaration in a style sheet. It is also used by JavaScript to access and manipulate the element with the specific id.
value attribute
gives a value to when something is submitted.
block-level elements
code that they appear on a new line.
<fieldset> </fieldset>
This element is used to group related inputs and labels together in a web form.
<legend> </legend>
element acts as a caption for the content in the fieldset element. It gives users context about what they should enter into that part of the form.
type=”checkbox”
creates a checkbox
for attribute
used in label and can allow text to identify the same action as the same id name in it
why should we include name to our input choice?
it allows for the website to process easier.
<footer> </footer>
allows for a footer to be added to website eg copy right - freecode camp.org
<head> </head>
All the important information goes in the head
<title></title>
the title of the page
<html>
</html>
allows software to know you are using html for code
<!DOCTYPE html>
his special string is known as a declaration and ensures the browser tries to meet industry-wide specifications.
meta charset=”UFT-8”>
Tells the browser to parse the markup into multiple languages
utf-8 is a universal character set that includes almost every character from all human languages.
<style>
</style>
You can add style to an element in html
<link></link>
allows you to link the html to different sheets like the css togther using href and rel to give it a value.
<meta></meta>
For the styling of the page to look similar on mobile as it does on a desktop or laptop
class attribute
allows for .class show to work in styling sheet
<article> </article>
elements commonly contain multiple elements that have related information.
<hr></hr>
display a divider between sections of different content.
method attribute
specifies how to send form-data to the URL specified in the action attribute. it can use as “get” or “post”
minlength attribute
minlength attribute with a value Doing so prevents inputs of less than issued characters being submitted.
input type=”number” min=”13” max=”12-“
the min and max number that a user can input
select element
creates a drop down allowing options to be chosen
options element
gives choices for the user to chose from
textarea element
acts like an input element of type text, but comes with the added benefit of being able to receive multi-line text, and an initial number of text rows and columns.
rows and cols
To give it an initial size of the text area element, you can add the rows and cols attributes.
link href=”https://fonts.googleapis.com/css?family=Open+Sans:400,700,800” rel=”stylesheet”
this imports the open sans allowing to be used in css