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

1.HTML

This is a mind map about 1. HTML. The main contents include: shortcut keys, HTML skeleton, tags (relative and absolute paths, anchor points <a></a>, lists, tables, and forms.

Edited at 2022-06-18 07:36:46

PlotWizard

Recent works View more works>>

1.HTML

PlotWizard

Recent works View more works>>

Recommended to you
Outline

HTML

shortcut key

HTML skeleton

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> </body> </html>

<!DOCTYPE html> <!>: indicates warning label <!DOCTYPE hypertext language>

<head></head>: Configuration of web page

<body></body>: the formal content of the web page, the visible area for browsing

<html lang="en"> English <html lang="zh-CN">Chinese lang: the main language of the entire web page

<title>Document</title> title: The text displayed in the browser tab fold area

Label

Notice: 1>The tag name must be written inside a pair of angle brackets <> 2> Tags are divided into single tags and double tags. Double tags must appear in pairs, with a start tag and an end tag. 3>The end tag must have a closing symbol / 4>Divide different tags into two levels according to the content stored inside the tag.

p tag: paragraph wrap

img tag <img src="images/123456.jpg" alt="I am the Bird's Nest" width="10px" title="Bird's Nest">

src: the path to import the image

alt: Replace the file when the image cannot be loaded.

width: width of the image

height: the height of the picture

title: floating text when the mouse moves to the picture

border: add a border to the image

Relative paths and absolute paths

relative path

/: Enter subfolder <img src="images/1.jpg" alt="">

../: Enter the upper level folder <img src="../../1.jpg" alt="">

absolute path

Absolute address of local drive letter <img src="C:/images/1.jpg" alt="">

Website absolute address <img src="Website address" alt="">

anchor point <a></a>

<a href="http://www.baidu.com" target="_blank" title="Mouse over text">Jump to Baidu</a>

href: jump address

target: How to open the address

blank: new page opens

title: floating text

<a href="#aaa">Basic information<a> Empty anchor point positioning <a name="aaa"></a>

<a href="#aaa">Basic information<a> <h1 id="aaa">Basic information</h1>

list

Unordered list: <ul><li><li></ul>

Recharge list: <ol><li></li></ol>

Definition list: <dl><dt></dt><dd></dd></dl>

table table

table: structure of the table

caption: The subject of the table

tr: row of table

th: header of the table

td: cell of the table

rowspan: merge up and down across rows

colspan: merge left and right across columns

form form

action: the location of data submission

method: method of data submission, attributes are post and get

input: label type

text: input box

value: default display content

placeholder: text placeholder to prompt the user

password: password box

radio: radio button

checkbox: checkbox

textarea: multi-line text

checked: selected by default

label: expand trigger range

Example: <label> <input type="radio" name='sex' checked="checked">Male </label>

Comment

Syntax

Common tags for HTML layout

Space &lt:less than sign >Greater than sign

span split

div: large split span

span: small area and small span