Web front-end review (HTML, CSS, JavaScript)

One, HTML

1. What is HTML
HTML is essentially HTML, you can show complex elements such as text, audio, and other programs.

2. What is the label
tag right: the tag name, attribute (name value pairs), content.
Properties similar to this is added a label of the equipment, so that these labels have some special ability.

3, Important Label Description
(1) Form tab Table
thead TH TR
tbody TR TD

  <table border="1">
       <thead>
            <tr>
                <th>表头1</th>
                <th>表头2</th>
            </tr>
       </thead>
      <tbody>
            <tr>
               <td>内容1</td>
               <td>内容2</td>
            </tr>
      </tbody>
</table>

Recommendations define the table when the tbody, thead describe it.

(2) form tag form
Action : submit the requested operation performed by address
Method, : specifies the type of request GET / POST
• Form submission form is not a must submit operated by Ajax request serialized form (serialize ()) way complete the form data submission. (Ajax is to serialize the data in the form of building is, the name refers to the unity of a string of submission to the background)
• Ajax request submission and submission of data is two completely different design principles adopted by form form.

(3) form elements labels
through submit submit data browser will form element in the manner of name-value pairs submitted to the server.

<input>:type(text,password,radio,checkbox,hidden)
<select>
<textarea>

And the value of the selected text on how to select get selected in the JS is, at the time of submission of the data, select the default will only
transfer the value of the selected option value in the past.

<form>
    <select>
        <option value="html">内容</option>
        <option value="html">内容</option>
        <option value="html">内容</option>
        <option value="html">内容</option>
        <option value="html">内容</option>
     </select>
</form>

form is what kind of concept? In Web programming, can be understood as a form of data collection (group), we put this package in the form of data sets, the unified submit background, for processing business logic, in a page can have multiple form exists. However AJAX request, may not require the presence of form.

Semantic 4, the label
H1 / H2 / H3 show the outline level
div / span / p performance layout

Use of the label with semantic search engines can quickly be included
although different labels might be able to achieve the same display, but it is strongly recommended to use semantic tags + CSS styles to control.

<style>
.hstyle {
display: block;
font-size: 2em;
font-weight: bold;
}
</style>
<h1>标题1</h1>
<span class="hstyle">标题1</span>

5, on the browser
browser runtime environment that can resolve the contents of HTML, CSS, JavaScript, images, audio and video.
We generally say that the browser is meant to include: IE / Firefox / Chrome / Opera, etc., where Firefox / Chrome we call a standard browser, W3C organization best meets the definition of relevant technical specifications.

If you do not have a standardized definition, in order to meet different browser vendors, programmers will pay a heavy price. But even
so, there are some subtle differences between different browsers, this problem is usually to pay attention to the development of the preceding paragraph, to consider browser compatibility.
We generally use the 360, Sogou browser kernel is based on a deep transformation.

6, CSS
Cascading Style Sheets: element pattern may be superimposed into a number of ways.

HTML element is not in itself have the style, but without defining styles, different labels can also show different display styles, because the browser on a different label is to have a default style.

7, how to define the elements of writing styles
in the development process, usually to define the style of the page style sheet through the chain to reduce the coupling between code and let a professional do it art page. This simply means that allows different people not to modify files in the same page, they care about their work.

(1) need to know the contents
• DIV + CSS layout based on full understanding of the box model
• box-sizing Note
• Style Selector: (.) ID (#) Class label (A DIV SPAN)

. 8, the JavaScript
(. 1) for the understanding of programming languages: a full-fledged programming languages should have: variables, data types, operators, control statements (sequential structure, branched structure, cyclic structure), self-contained API.
(2) the role of JavaScript
• Business logic
• the DOM Operation (DOM: Document Object Model): page model changes by event-driven (DOM tree deletions of elements to change search, especially change: change content, change style) because JavaScript can manipulate the DOM of JavaScript that implements the interface DOM-related operations to meet the operations on the DOM.
(3) need to know the contents of
JavaScript is weakly typed language, and writing is more casual.
• weak language reflected in the variable is no accurate data type definitions. Defined by the var keyword.

// 动态类型,随值的变化而变化
var flag = 'abc';
flag = 12;
flag = true;
flag = {name : 'Tom'};
flag = function() {
alert("Hello,JavaScript");
}

• determine the conditions for JavaScript

1. In the conditional expression, the numbers 0 and non-0 may be expressed as false and true
indicates that the card 2. The branched structure
3. The ternary operator is familiar with the need, which is essentially an expression

var age=20;
var str=age>=18 ? ' 成年 ' :' 未成年 ';
console.log(str);
Published an original article · won praise 0 · Views 14

Guess you like

Origin blog.csdn.net/Cherry19/article/details/104481371