Three basic front-end technologies

HTML

HTML (Hyper Text Markup Language): It is a language for constructing web pages, which displays images, sounds, pictures, texts, etc. through tagged instructions (Tag). It stipulates its own language rules to express items of meaning richer than "text".

HTML5: The latest standard for html, formulated and released in 2014. html5 has added some semantic tags to support video, audio audio and video, canvas/webgl and other capabilities.

HTML basic tags: head, body, html, title (h1-h7), paragraph (p), link (a), image (image), table (table), list (ul, ol), etc.

The basic structure of an html document:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello</title>
</head>
<body>
<p>Hello</p>
<a href="http://www.baidu.com"></a>
</body>
</html>

CSS

CSS (Cascading Style Sheets): Cascading Style Sheets, a construction language that defines styles, such as fonts, colors, and positioning. They describe how to format and display information on web pages.

CSS3: The latest css standard. css3 adds new features such as animation and selector. A major change in the evolution of CSS3 is the W3C's decision to divide CSS3 into a series of modules. It mainly includes modules such as box model, list module, hyperlink mode, language module, background and border, text effects, multi-column layout, etc. Dividing into several smaller modules is more conducive to the timely update and release of the specifications. Manufacturers can also choose to support part of the css3 module capabilities to facilitate the promotion of css3.

The writing position of css in html:
1. Write in the line (not recommended)

<h1 style="color:red">haha</h1>

2. Write in the style tag in htmI (not recommended)

<style>
h1{
     
     
color:red
}
</style>

3. Link method (recommended)

<link rel="stylesheet" type="text/css" href="style.css">

JavaScript

javascript: An interpreted scripting language (code does not need to be compiled and can be run directly), the purpose is to add javascript to the client's web page plus dynamic effects and interactive capabilities, to achieve a real-time, dynamic between the user and the web page Interactive relationship.

ECMAScript: The standard of the JavaScript language. JavaScript is the implementation of the ECMAScript standard. javascript was originally designed by Netscape in 1995 and was named LiveScript. Later, the Java language became very popular. Netscape hoped to use ECMAScript to help promote the reputation of Java and changed its name to JavaScript. The JavaScript 1.1 version was handed over by Netscape. Develop a scripting language standard for ECMA, newly named ECMAScript (copyright issue, standard openness and neutrality).

ES6/ES2015: In 2015, ECMA released version 6.0, referred to as ES6/ECMAScript 2015.

JS composition: ECMAScript (the core of JS), DOM (document object model)

BOM (Browser Object Model)

a.ECMAScript: mainly defines the syntax and data types of JS

b. Document Object Model (DOM): A set of APs that manipulate page elements. DOM can regard HIML as a document tree, and the nodes on the tree can be manipulated through the API provided by DOM

C. Browser Object Model (BOM):-A set of APIs for operating browser functions, and browser windows can be operated through BOM

The writing position of JS in html:

1. Write in the line (not recommended)

<button class="btn btn-pause" onclick="alert('haha')">暂停</button>

2. Write in the script tag in html (not recommended)

<script>
alter('Hello World!');
</script>

3. Write in an external js file (recommended)

<script type="text/javascript" src="/js/Hello.js"></script>

Guess you like

Origin blog.csdn.net/weixin_43900284/article/details/112555090