HTML & CSS Flashcards
HTML
Hyper Text Markup Language
Not a programming language, rather a markup language for creating webpages / documents
HTML is the building block of the Web.
Markup Language
A system for annotating or structuring documents in a way that provides instructions or metadata about the content’s presentation or meaning.
Markup languages use specific tags or codes to define the structure, formatting, and behavior of elements within a document.
Examples include HTML, and XML.
Markup languages play a crucial role in organizing and presenting information across various platforms and applications, enabling consistent formatting and interpretation of content.
What is needed to start using HTML?
You will need:
- Web Browser
- A Text Editor
What do you need to know about HTML file creation?
- Does not require a server
- Files must end with the .html file extension
- Runs in a web browser
- index.html is the root / home page of a website.
HTML Tag
An HTML tag is a syntax element used in Hypertext Markup Language (HTML) to define the structure and formatting of a web page.
HTML tags are surrounded by angle brackets (< and >) and consist of an opening tag, content, and a closing tag. The opening tag identifies the type of element, while the closing tag marks the end of that element.
<p>This is a paragraph.</p>
In this example, the <p> tag is the opening tag, and </p> is the closing tag. The content “This is a paragraph.” is the text that will be displayed as a paragraph on the web page. HTML tags can have attributes that provide additional information or modify the behavior of the element. For instance, the <a> tag for creating hyperlinks can include an href attribute to specify the target URL.</a>
HTML Heading Tags
Range from <h1> to <h6>.
<h1>: this is the highest level of heading and represents the main heading of a web page. Typically, there should only be one <h1> tag per page, and it defines the topic of the page.
<h2>: this tag represents subheadings that are slightly less important that '<h1>' headings. It can be used to divide the main sections of the page
<h3>: This tag represents subheadings within the sections defined within <h2> headings. It further breaks down the content into smaller subsections.
<h4>: Creates subsections within <h3> headings.
<h5>: Creates subsections within <h4> headings.
<h6>: Creates subsections within <h5> headings. The lowest level of heading within html.
</h5></h6></h4></h5></h3></h4></h2></h3></h1></h2></h1></h1>
<p> Tag
</p>
Marks the start of a paragraph. Ended with </p>.
Inline Element
- Do not start on a new line
- Take only the necessary width
- <span>, <img></img>, <a></a></span>
Block Elements
- Start on a new line
- Take full width available
<div>, <h1>-<h6>, <p>, <form>
</form></p></h6></h1></div>
<strong> tag</strong>
The <strong> tag in HTML is used to define text that should be rendered as strong emphasis. It typically makes the enclosed text appear in a bold font style by default, although the actual rendering can vary depending on the browser and CSS styles applied to the tag.</strong>
The <strong> tag is primarily used to highlight important or significant content within a paragraph or section.</strong>
<em> tag</em>
The <em> tag in HTML is used to define text that should be rendered as emphasis. It typically makes the enclosed text appear in italics by default, although the actual rendering can vary depending on the browser and CSS styles applied to the tag.</em>
<a> tag</a>
Used to insert a link into an HTML page, typically used in association with a n attribute.
HTML Comments
Allows you to annotate your HTML script without effecting what is displayed on the web page itself.
<!-- text -->
Used purely by the developer.
<!DOCTYPE html>
Not necessarily a tag used within an html page, however, it should always be the first line used when writing HTML.
DOCTYPE indicates what version of HTML is being used.
HTML Attributes
In HTML, an attribute is additional information that is added to an HTML element to provide extra details or modify its behavior. Attributes are specified within the start tag of an element using the attribute name and value. They provide a way to customize the elements and define various properties.
Attributes can also have values, which are assigned using an equals sign (=) after the attribute name, enclosed in quotes. The attribute values provide additional information or specify certain settings related to the element or its behavior.
It’s important to note that different HTML elements support different attributes. You can refer to documentation or references for specific elements to learn about the available attributes and their usage.