Features
Features:

Product Tour >

Edraw AI >

Paid Plans:

Individuals >

Business >

Eduaction >
Resources
Blog

History

How-tos & Tips

Discovery

Biography

Business Analysis

Examples

AI concept Map

Free AI Mind Map Generator

Onenote Mind Map

Bcg Matrix Examples

Nike Marketing Strategy

Unilever SWOT Analysis

Make Mind Maps in Google Docs

Guide

FAQs

What's New

Resource Center
Templates
All Templates

Brain Storming Templates

Strategy and Planning Templates

Project Management Templates

Product Management Templates

Human Resources Templates

Agile Workflow Templates

Marketing Templates

Education Templates

Fun and Games Templates

User Gallery
Download
Pricing
Enterprise

HTML markup language

The following is a mind map about HTML markup language, which introduces the basics of HTML language, HTML media, HTML tags, introduction to HTML, web browsers, etc.

Edited at 2021-12-20 16:50:10

PlotWizard

Recent works View more works>>

HTML markup language

PlotWizard

Recent works View more works>>

Recommended to you
Outline

HTML markup language

HTML language basics

HTML title

<h1>This is a title</h1> <h2>This is a title</h2> <h3>This is a title</h3>

<h1> defines the largest heading. <h6> defines the smallest heading.

The browser will automatically add blank lines before and after the title

1. Don’t use headings to create bold or large text 2. Search engines use headers to index the structure and content of your web pages 3. Users can quickly browse your webpage through titles, so it is important to use titles to present the document structure. 4.h1 is used as the main title (the most important), followed by h2 (the second most important), then h3, and so on.

HTML paragraph

<p>

<p>This is a paragraph. </p> <p>This is another paragraph. </p>

The browser automatically adds blank lines before and after paragraphs. (</p> is a block-level element)

HTML link

<a>

Tip: Specify the address of the link in the href attribute

A hyperlink can be a word, a word, a group of words, or an image. You can click on these contents to jump to a new document or a certain part of the current document

When you move your mouse pointer over a link on a web page, the arrow changes into a small hand

By default, the link will appear in the browser as

An unvisited link appears in blue font and underlined Visited links appear purple and underlined When a link is clicked, it appears red and underlined

target attribute

_blank _parent _self _top framename

HTML image

<img/>

The name and dimensions of the image are provided as attributes

HTML horizontal line

<hr/>

Can be used to separate content

HTML comments

It can improve its readability and make the code easier to understand. The browser ignores comments and does not display them

How to view the source code of a web page

Right-click > Select "View Source" (IE) or "View Page Source" (Firefox)

Shortcut key F12

HTML line breaks

<br />

Wrap (new line) without creating a new paragraph

<p>This is<br>a para<br>graph with line breaks</p>

HTML output

when displaying the page

Browsers remove extra spaces and empty lines from source code. All consecutive spaces or empty lines are counted as one space. All consecutive empty lines (newlines) in HTML code are also displayed as a single space.

HTML formatting tags

text formatting tag

Tag Description <b> Define bold text <em> defines emphasis text <i> Define italics <small> defines small fonts <strong> Define emphasis <sub> defines subscripts <sup> defines superscript words <ins> defines insertion words <del> defines the delete word

"Computer Output" Tag

Tag Description <code> defines computer code <kbd> Define keyboard code <samp> defines a computer code sample <var> defines variables <pre> defines preformatted text

HTML citations, quotes, and tag definitions

Tag Description <abbr> Define abbreviation <address> defines the address <bdo> defines text direction <blockquote> defines a long quote <q> defines short quotes <cite> defines reference, citation <dfn> defines a definition item.

HTML media

theme

Introduction to HTML

HTML file = descriptive text composed of HTML commands

HTML commands = description text, graphics, animations, sounds, tables, links, etc.

HTML file structure = Head, Body

Header = describes the information required by the browser, body = contains the specific content to be explained

What is HTML?

Hyper Text Markup Language: Hyper Text Markup Language

NO programming language, YES markup language

Markup language = markup tag (markup tag)

Markup tags are used to describe web pages

HTML is a language used to describe web pages

HTML document=HTML tag text content

HTML document=web page

HTML documents are composed of nested HTML elements

HTML tags/elements

Keywords surrounded by angle brackets, such as <html>

Appear in pairs, such as <b> and </b>

The first opening tag (open tag), the second closing tag (closing tag)

HTML markup tag

The content of the element = the content between the start tag and the end tag

Some HTML elements have empty content

Empty elements are closed in the opening tag (end with the end of the opening tag

Most HTML elements can have attributes

Use lowercase tags

web browser

Google Chrome, Internet Explorer, Firefox, Safari

Function: 1. Read HTML files 2.Web page display

HTML tags that are not displayed, use tags to determine how to display the content of the HTML page to users

HTML page structure

<!Doctype html> declares the document type <html> defines HTML document <body> defines the body of the document <h1>This a heading</h1> defines the HTML heading <p>This is a paragraph.</p> Define HTML paragraph <p>This is another paragraph.</p> </body> </html>

HTML version

Version Release time HTML 1991 HTML 1993 HTML 2.0 1995 HTML 3.2 1997 HTML 4.01 1999 XHTML 1.0 2000 HTML5 2012 XHTML5 2013

<!DOCTYPE> declaration

Helps the browser display web pages correctly

not case sensitive

<!DOCTYPE html> <!DOCTYPE HTML> <!doctype html> <!Doctype Html>

General statement

HTML5 <!DOCTYPE html> HTML 4.01 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> XHTML 1.0 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

HTML attributes

Additional information can be added to the element

Generally described in the opening tag

as name/value pairs

name="value"

Commonly used reference attribute values

Attribute values should always be enclosed in quotes

Double quotes are the most commonly used, but there is no problem using single quotes.

The attribute value itself contains double quotes, then you must use single quotes

name='John "ShotGun" Nelson'

Attributes applicable to most HTML elements

Property Description class defines one or more class names (classname) for html elements (class names are introduced from style files) id defines the unique id of the element style specifies the inline style of the element (inline style) title describes additional information about the element (used as a toolbar)