The Web Developer Bootcamp-Frontend
front end
Related front-end technologies used by The Web Developer BootCamp, html, css, Jquery, Bootstrap, Javascript
HTML
HTML (Hypertext Markup Language), for making web pages, html is equivalent to the skeleton of a web page, similar to nouns in English. A meaningful sentence must have nouns to let others know what you want to express. A web page needs one A skeleton full of nouns to tell others what you want to display. Plain html text is just a stack of content you want to display. In the subsequent process, CSS will be used to optimize the interface. CSS is equivalent to an adjective in English. To make the website more beautiful.
Detailed website tutorial: https://developer.mozilla.org/en-US/docs/Web/HTML, including some more basic knowledge and all tag content
Here are some basic syntax
-
General Form (general expression form of html)
<tagName> Some Content </tagName> -
Basic Type (code required for a complete web page)
<!DOCTYPE html>
<html>
<head>//头部文件，会放置引用，title等
<!-- Our metadata goes here -->
<title></title>
</head>
<body>//具体展现的内容
<!-- Our content goes here -->
</body>
</html>
- Comments, the annotation method used by html language
<!-- This is a comment. It doesn't do anything! -->
Below are some of the contents that I think are important, others can be found at the website link above
1. Div and Span
Div is usually used to distinguish paragraphs. It is used more than Span. When using CSS, it can be used to distinguish each block and make each block modular. Span can be used in a paragraph without starting a new line. Div is very commonly used in Bootstrap.
2. Some important and commonly used Elements
order list, unorder list
form, button (different from Submit), input(text,password)
select(option)
3 . <style></style>, A small amount used to write CSS (on Head)
4 . <link rel="stylesheet" href="bootstrap.css">Used to refer written in external CSS files. (Placed in the head)
5 . <script src=" "></script>Is used to reference an external JavaScript file. (Placed in the head)
. 6 . <form action="" method=""></form>
Method = "GET" Get Information
method = "Post" information submitted
will operate differently depending on the server side of the method.
eg:
router.post("/", middleware.isLoggedIn, function(req, res){
})
router.get("/", function(req, res){
})
The obtained URL is the same, and different methods correspond to different operations.
After filling in the relevant input in the form, use get to see the data in the URL
7 . <input type="">
Text the Button Radio the Submit password ...
required
οnsubmit = "(JavaScript function)" written in the form where do check format
8.Attributes
name:可重复
id:unique
class: could be utilized by bootstrap, CSS to do the decorate.
JUDGMENT
Document Object Model
CSS
Cascading style sheets, which act on html text, are equivalent to adjectives in English to decorate pages.
The basic form consists of two parts, selector + declaration
selector {declaration1; declaration2;… declarationN}
Selector
1.ELement
li{
}
2.class
.hello{
}
3.id
#name{
}
4.Descendent
ul li a{
}
5.Adjacent
h4 + ul{
6.Attribute
a[href=""]{
}
input[type=""]{
}
7.nth
li:nth-of-type(3){
}