Home > front end >  Basic knowledge of HTML - study notes
Basic knowledge of HTML - study notes

Time:12-06

1, the Html
- hypertext markup language ( HyperText Markup Language
Concept: a page is a document (web page), is used to define the content structure of the document (the title, pictures, text, paragraphs, etc.),

1.1 HTML document format: HTML or. HTM
A complete file by index (file name). (separator) HTML (extension),

1.2 Html : edit content in the body;
 & lt; ! DOCTYPE html> 

<meta charset="utf-8" & gt;
<meta name="viewport" content="width=device - width, initial - scale=1.0" & gt;
Document

<body>

: define the type of document, the browser USES the standard model to parse (e.g., don't will use quirks mode),
Left
Document, document type - type

1.3 Html comments format: & lt; ! -- -- & gt;
Html comments: used to describe the code function (which would be to ignore the browser parses, developers and maintenance personnel to see),

1.4 Html elements: it is an important part of the Html document, an Html document consists of a large number of element
Example: & lt; H1 & gt; (start tag) basic exercises (element content) & lt;/h1 & gt; (the end tag)
Developing: h1 - operation h6
H element, the smaller the number, on the page show that the greater the effect of word
H, the greater the number of elements, on the page shows that the smaller the effect of word
A element:
 & lt; A href="https://bbs.csdn.net/topics/www.baidu.com" target="love" & gt; Immediately to join & lt;/a> 
Target page open way
Love the current window to open the new page
_blank to create a new window opens
- & gt;


Steps
1, add a tag
2, and add the jump link
3, add the id attribute value to jump the tag
4, a tag to add the value of the href
Jump labels to add to add the id attribute value, adding # - & gt;


For a tag name, element name, tag name, this is a hyperlink, href: attribute names, "www.baidu.com" for the attribute value; href=https://bbs.csdn.net/topics/"www.baidu.com" for attributes: add additional information for the element, after a user clicks can jump; Immediately add: as the element content, content should be displayed on the page,
Tag name, attribute, the element content to the display content and behavior of an element,
empty elements: no element content, also does not have an end tag, also called self closing element;
In the writing of empty elements:
 & lt; Img SRC="https://bbs.csdn.net/topics/URL location" Alt="text alternative images & gt;" 

SRC: to extract the image location, image URL location;
Alt: text alternative images, when the image URL location is not correct, display text,
reference text> :
q: a small section of the reference; Applicable scenario: leaming; Bring their own style, ", "
blockquote tag : large section of the reference; Applicable scenario: refer to the entire article or paragraph; Bring their own styles: on the left side of the indented 2 characters,
cite element : reference; Bring their own styles: italic; Can when elements and attributes, attribute: refers to the source address,
(note: if a paragraph using cite, if one of strengthening a few word with I,)
abbr element: the abbreviation of reference; Applicable scenario: abbreviations or jargon; Bring their own styles: underline the dotted,
emphasize text> :
strong tag - important text, b labels - highlighted,
- bold text reading (no more ordinary browsers, browser strong tags can aggravate the pronunciation)
em text tag - emphasize that I label - a distinction between text,
- italics (ordinary browsers, browser read em tags can aggravate the pronunciation)
no semantic elements:
div : it means an area of the page, apply scene: dividing area;
span : add a small piece of text used only for style;
br : empty elements, newline;
Blank fold: a space, enter one or more Spaces, enter into a space, press enter; Left
: the pre element pre-formatted elements, will copy the HTML code to the page of display (reserved words in source code format),
hr elements: line,
:
The written form: & amp; NPSP;" & amp;" To start, ";" The end, on the page to realize special characters,

1.5 element hierarchy : the contents of an element can contain other elements, the formation of nested hierarchy, between two elements cannot be nested each other;
If A element containing the B: is the parent of the A to B, B, as A child element
If two elements have the same parent element: they are sibling elements
If A directly or indirectly contains B: is the ancestor element B, B is the offspring of A element

1.6 HTML ;
Semantic structure elements (benefits: make the structure more clear, easy to distinguish between 1. Better realize the CEO (search engine optimization (seo) 2. To be read from a special equipment)
header : used to represent a page or the head of a region;
nav : used to represent a navigation bar;
value : used to indicate additional information relevant to the subject matter with the surrounding; (if it is advertising on the nearest body ending tag location)
the article : used for articles or other pages can be independent of content;
section : is used to represent an integral part of the subject;
footer : used to represent a page or a region of footnotes.

1.7 the absolute path and the relative path;
: agreement://domain/directory
- access to stand outside resources; (http://www.baidu.com/xxx)
- access to resources within the station, such as above to the server, using the absolute path reference can be omitted when the protocol and domain name, (/XXX)
  • Related