Home > Developer > Web Develop
I. Basic page templates, which generally include six major documents:
In your folder generally contains six documents: Index.html, CSS, JS, IMG, lib (If you have learned bootstrap), fonts
(In this brief introduction, the follow-up will be related to each part of the relevant content written to share with you)
(i). Index.html (structural framework-structural layer from semantics, describing the structure of the Web page)
Hypertext Markup Language, English full spell: Hypertext Markup Language. Responsible for the semantic description of the Web page.
HTML Basic skeleton:
<! DOCTYPE html>
<meta charset= "Utf-8" >
<title></title>
<body>
</body>
Doctype: text type if only write: HTML then this represents the HTML5 Web page type, which conforms to the standards of the Internet.
Html: Root tag that contains all the contents of a Web page
Head: Responsible for the page property configuration, do not do any display content operation.
meta: translates to "Meta", which represents the basic attribute.
<meta name= "keywords" content= ""/>
Keywords: Web search keywords, search these keywords can find our page
<meta name= "Description" content= ""/>
Description: page description, provided to the user to see the introduction of the page, conducive to search engine optimization (SEO)
Charset: A character set that tells the browser which encoding standard is used for the current Web page.
To add: There are two types of encodings that can be supported:
The first type of UTF8 International code
The second gb2312 Chinese code, Chinese text library plus some general character languages for foreign languages
UTF8 encoded >gb2312 encoding (text library content), utf8 each Chinese character occupies 3 characters, in gb2312 species only 2 characters.
Advantages of using gb2312: small, fast!
Note: the encoding format for text saving must be exactly the same as the encoding format declared inside the page, or it will appear garbled!!!!
Title : page titles, search engine optimization.
Body: The Web content tag is actually a large container. All of our semantic tags are in the body.
(b). CSS (style settings--style layer from the aesthetic point of view, beautify the page)
css English full spelling:cascading style sheet cascading style sheet.
Use in HTML: to write a style tag in the head, all styles are placed in the Style tab.
CSS Three principles: overlay Principle, priority principle, proximity principle (code in)
See if there are conflicts between multiple selectors, and if the properties are not conflicting, implement the attribute overlay.
If there are conflicting attributes, the priority of the selector (weight) is determined by the preference of the attribute.
If there are still selectors with the same precedence and attribute conflicts, implement the nearest principle (the latest in CSS code is the main)
<style>
h1{
color:red; Set Text color
font-size:30px; Set Text Size
Set Background color
}
span{
Color:blue;
Font-weight:bold; Set text Bold
Font-style:italic; Set Text italic
Note: use normal when you want to set the default style for font start
Text-decoration:underline; Sets the text glide line, if the drop line is removed with the None attribute
}
li{
Color:orange;
}
#fly {
Color:blue;
font-size:40px;
}
</style>
(c). JS (Logical behavior--the behavior layer from the interaction to enhance the user's experience)
JavaScript, also known as JS, is a scripting language. Used to make Web pages interactive effect, enhance the user's experience.
For example, some small ads, Carousel Diagram, tab group, waterfall flow ... It's all JS.
Does anyone think JS is the same as Java? actually
It doesn't matter, it doesn't matter at all. That was to draw the attention of programmers. The first time belongs to the page "psoriasis", making small ads ah, pop windows, floating ads and so on.
(iv). IMG (Image storage)
Img: English full spell image-image.
SRC: English full spell source-source path, this property we write the path of the image.
Absolute Path: The full path of your computer where the current file resides.
relative path: First you have a reference path, the reference path is the file path where the current HTML page resides. Then find the picture path based on the reference path
The IMG tag must be accompanied by an extension when writing the path, and the types of images that can be supported are JPG, JPEG, PNG, BMP, GIF. It is best to add the width and Height properties for performance reasons.
(v). Lib (Bootstrap repository)
Lib is a library referenced from bootstrap, generally including the download from the Bootstrap dist (CSS, fonts, JS), jquery two parts, and to note that if the download is the source code, the downloaded CSS, JS refers to the. css, not the MIN.CSS
(vi). fonts (font-related settings)
Related to font size Ah, font color AH ... In short, there are various styling attributes about the font.
---------------------------------------------------Mutual Encouragement ------------------------------------------------- --------
Beginner--How to properly build a Web template----on the road (5)
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
