Html tags and tags
Common shortcut keys
Ctrl + c |
Copy |
Ctrl + v |
Paste |
Ctrl + x |
Cut |
Ctrl + |
Select All |
Ctrl + s |
Save |
Ctrl + z |
Undo step |
Windows + d |
Back to desktop |
Windows + e |
My computer |
Windows + r |
Open and run |
Alt + tab |
Switch Software |
Ctrl + tab |
Switching between Software Documents |
F2 |
Rename |
F5 |
Refresh page |
Develop a habit.
3 Webpage Recognition3.1 A webpage consists of text, images, input boxes, videos, audios, and hyperlinks.3.2 Web standardsW3c organization (World Wide Web Alliance)
Html structure standard equivalent to human body
Css performance standards are equivalent to making-up more beautiful.
Js behavior standards want to be more agile when people sing.
3.3 Basic Course ArrangementHtml 2 days
Css 7 days
Js 3 days
3.4 Browser◆ The browser is a client (software) for accessing the Internet ).
3.5 Browser kernel
Rendering Engine
Rendering engines are the root cause of compatibility issues.
3.6 About browsers and serversIIS web server provides web browsing service
3.7 UrlThe Url is what we call the Url.
4 Understand html4.1 Hyper text markup language
Hypertext markup language.
Hypertext: hyperlink. (Page Jump)
4.2 Html structure Standard<! Doctype html> declare Document Type
<Html> root tag
<Head> header label
<Title> </title> title Tag
</Head>
<Body> subject tag
</Body>
</Html>
Html is the same as htm.
The extension name cannot determine the file format, but can only determine how to open the file.
4.3 Html Tag ClassificationSingle tag <! Doctype html>
Double tags 4.4 Html Tag link Classification
Include (nested relationship)
<Head> 4.5 Development Tools
Dw has a long history and is used by designers.
Sublime is lightweight and has many useful plug-ins.
Webstorm is too intelligent.
|
Create a file, open a file, and open a folder |
Html: xt + tab |
Html Structure Code |
Tab |
Complete tag code |
Ctrl + shift + d |
Fast copy a row |
Ctrl + shiif + k |
Delete a row quickly |
Ctrl + left mouse click |
Collective input |
Ctrl + h |
Search and replace |
Ctrl + f |
Search |
Ctrl +/ |
Note |
Ctrl + L |
Quickly select a row |
Ctrl + shift + average (average) |
Move up (move down) a row quickly |
F11 |
Full Screen |
|
View ---- Layout |
Sublime Shortcut Key Usage:
4.6 Set the default browserIn the upper-right corner of the Chrome browser, set the default browser in settings.
5 Tag5.1 Single tag◆ Comment the tag ctrl +/
◆ Line feed label <br/>
◆ Horizontal line label
5.2 Dual tags <P> text content </p>
Feature: Empty rows are automatically generated up and down. <Br> line breaks do not generate blank lines.
Title label
H1-h6 to h6
H1 can only appear once on a page.
Text tag
<Font> text content </font>
Text format tag
Bold text labels <strong> </strong> <B> </B> Use strong whenever possible during work
Text skew label
<Em> </em> <I> </I> try to use em
Strikethrough labels
<Del> </del> <s> </s> try to use del
Underline label
<Ins> </ins> <u> </u>
◆ Note: <strong> </strong> <em> </em> <del> </del>
<Ins> </ins> is more semantic.
5.3 Image Tag
Src image source mandatory attribute
Alt replaces the text that is displayed when the text image is not displayed
Title indicates the text displayed when you place the cursor over the image.
Width
Height: Image Height
◆ When no width or height is defined for an image, the image is displayed in a aspect ratio. If you only change the width or height of the image, scale the image proportionally.
6 Path6.1 Relative PathRelative to the file itself, it is the relative path.
◆ File and image (html document) in the same directory (folder), directly write the file name.
◆ The image (html document) is in the next-level directory of the file. Folder name +/+ image (html) Name
◆ The image (html) is in the upper-level directory of the file, and the name of the .. ++ image (html) is
◆ The image is in another directory at the upper level of the file./folder name/image name
★Conclusion: Find the image (File) in the next-level directory (folder)/
Jump out of the current directory and use ../
6.2 Absolute path7 Hyperlink
Href = "http://www.qianhtj.com" to the path (jump page) Mandatory attribute
Title = "explanatory text" indicates the text displayed when you place the cursor over the link.
Target = "_ self" is opened on its own page by default (close its own page and open the link page)
Target = "_ blank" to open a new page (the page itself is not closed, open a new link page)
7.1 Anchor1. Define an anchor.
2. hyperlink to the anchor
7.2 Empty chain I don't know which page to link.7.3 Download compressed files Not recommended7.4 Hyperlink Optimization
8 Save Ctrl + shift + s9 Special characters
10 List10.1 Unordered list
<Ul>
<Li> </li> list items
<Li> </li>
<Li> </li>
</Ul>
Type = "square" Small square
Type = "disc" solid small circle
Type = "circle" small hollow circle
10.2 Ordered list<Ol>
<Li> </li> list items
<Li> </li>
<Li> </li>
</Ol>
◆ Type = "1, a, A, I, I" type can be 1, a, A, I, I
Start = "3" determines the start position.
10.3 Custom list<Dl>
<Dt> </dt> subtitles
<Dd> </dd> explain the title
<Dd> </dd> explain the title
</Dl>
11 Music tag
12 Scroll
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
