To view the source code for the specified element in the page:
In the browser, press F12 to open "Check Elements", tab select "Elements" or "element", click on the upper left corner of the "SELECT Element" button, the button becomes blue, you can use the mouse to select the specified element in the page, click on the source bar will automatically jump to the source code corresponding to the element.
Each label has a default style, you can customize the label, or you can change the default style of the label.
H1~h6:
Six Standard title tags
Suggest a page only a H1 tag, is advantageous for search engine search.
P:
Paragraph label, end Wrap (display:block)
B:
Bold label, no Line break (Display:inline)
Strong:
Emphasis on bold tags, no line break (display:inline), facilitate search engine search
I:
Italic label, no Line break (Display:inline)
Em:
Emphasis on italic label, non-line break (display:inline), facilitate search engines
HR:
Horizontal line Label
Br:
Line break label
Special symbols
Less than number:--<
Greater than sign:-->
Space Number:--12 34
Blank bit:--12 34
& Character:--&
Copyright Symbol:--©
A:
Hyperlink label
<ahref= "Http://www.baidu.com"Target= "_blank">Go to Baidu</a><!--link jump to Baidu -<ahref="#">#</a><!--Refresh the current page -<ahref= "javascript:void (0);">Dead link</a><!--dead link, won't jump -<ahref= "#box">Anchor Point</a>
<!--
Only the A tag with the Name property has an anchor
other tags can implement an anchor point through the id attribute, a tag can also be an anchor point with an id attribute
Target property
_self The current page opens the default
_blank opens in a new window
_ Open in
_top top-level frame open
ID name
ID can only have one name, and the same name can only appear once in the page, equivalent to the identity card number
Class name
class can appear multiple times, And the same name can have multiple, equivalent to a person name
-->
IMG:
Image label
<src= "Http://mat1.gtimg.com/ipad/qq_time/imgs/slider_20180216_chunjie.jpg" > < src= "img/0.jpg" alt= "cute" width= "Max" Height= "Max">
<!--
SRC definition picture Path
Alt picture description, for SEO search
width defines picture widths
Height defines picture heights
When Width/height gives only one value, another value is scaled, if not configured, the default picture size
-
UL > LI:
Unordered list
Quick action: Enter ul>li*4, press TAB, automatically appear under the UL tag 4 li tags appear
<ultype= "Square"><Li>1</Li><Li>2</Li><Li>3</Li><Li>4</Li></ul>
Type property, with a value of
Disc default Small black dot
Circle Hollow Circle
Square Small Square box
OL > LI:
Ordered list
<oltype= "1"Reversed Start= "2"><Li>10</Li><Li>20</Li><Li>30</Li><Li>40</Li></ol>
Type property, with a value of
1 1 2 3 4 default
A A B c D
A a B C D
I
I
Reversed attribute Descending sort
Start property ordered list start value
DL > DT > DD:
Definition List
<DL><DT>Title</DT><DD>Item 1</DD><DD>Item 2</DD><DD>Item 3</DD></DL>
Div and Span:
<div> tags divide the document into separate, distinct parts. It can be used as a strict organizational tool and is not associated with any format.
<span> tags are used to combine inline elements in a document.
DIV, one line alone (Display:block)
SPAN, not exclusive row (Display:inline), does not support setting the width height, which is supported by the inline element.
If the display of the div is set to inline, the Div also does not support setting the width height, does not own a row, and becomes the same as the span label, and the Display:block,span to the span tag is also a div
Inline block elements: Display:inline-block block-level elements can be displayed horizontally, and inline elements can be set to a wide height
Hidden elements: Display:none includes his child tags, which do not occupy a position in the page, the equivalent of disappearing
Style settings:
Insert <style> tags in the
<style>Div{width:100px;Height:100px;background:Blueviolet;Display:Inline-block;vertical-align:Top;}span{background:Blue;}. Box{Display:None;}</style>
<style> tag, the label is configured, the tag name is used to borrow curly braces, configure the style; To configure a class, add a '. ' Before the class name. To configure an ID, add a ' # ' before the ID name.
Front End (1) HTML