Home > Article > Web Front-end > What are the three foundations of the front-end?

What are the three foundations of the front-end?

青灯夜游Original: 2021-11-01 15:50:034093browse

The three front-end foundations refer to: 1. Hypertext Markup Language HTML, which is a language for constructing web pages; 2. Cascading Style Sheet CSS, which is a structural language for defining styles; 3. Embedded Scripting language Javascript is an interpreted scripting language used to achieve a real-time, dynamic interactive relationship between users and web pages.

The operating environment of this tutorial: windows7 system, CSS3&&HTML5&&javascript version 1.8.5, Dell G3 computer.

Nowadays, the popularity of front-end is beyond the imagination of developers. It is obviously just a simple development of a page, and it is not as popular as what is said on the market. In fact, lines are separated like mountains. Many times when we stand outside the door, we cannot understand the actual situation inside the door.

The reason why the front end is becoming more and more important is actually that the user experience has been raised to a very high level. This is thanks to Gang Leader Qiao. Without him, we might still be in the world of Symbian. Difficulty moving.

The front-end field that directly interacts with users has reached jaw-dropping heights. Even so, the foundation of the front-end, that is, the core technology of the front-end has not changed.

The languages that make up the daily front-end development are still HTML, CSS, and Javascript.

1. HTML-Hypertext Markup Language

HTML (Hyper Text Markup Language): is a language for constructing web pages. Display images, sounds, pictures, text and other content through tag commands (Tag). It stipulates its own language rules and is used to express richer meaning items than "text".

HTML5: The latest standard for html, formulated and released in 2014. HTML5 adds some new semantic tags to support video, audio, 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>

2. CSS-cascading style sheet

Although it has been developed for many years, it is The language still has little say, the language was actually created to solve the problem of bloated HTML tags (tab elements), and the language design is really great. The core of CSS is the definition and selector of document flow. By redefining HTML documents, the concept of document flow is introduced, and the original bloated tags can be used to modify the style of page content through flexible selectors. What needs to be focused on is the definition of document flow, the element box model, and the destruction and modification of document flow.

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

CSS3: the latest standard of css. CSS3 adds new features such as animations and selectors. A major change in the evolution of CSS3 is the W3C's decision to break 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 and other modules. Dividing it into several smaller modules is more conducive to timely updating and releasing of specifications. Manufacturers can also choose to support some CSS3 module capabilities to facilitate the promotion of CSS3.

The writing position of css in html:

1), written in line (not recommended)

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

2), written in htmI In the style tag (not recommended)

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

3), link method (recommended)

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

3, Javascript-embedded scripting language

Initially, because Javascript ran in the browser, it was often called an embedded script, but it still did not affect Javascript becoming a powerful programming language. This language mainly implements the response problem of user behavior, so it responds to different operation results based on user behavior events. This language is the focus of the front-end because all user experiences require Javascript to be implemented. The language is becoming more and more complete and gradually moving towards static.

1), library

The library is an encapsulation implementation for a specific function, such as an encapsulation implementation for file upload scenarios, which is called a file upload class library. This is by way of example, but not limited to this.

2), Framework

The framework is an encapsulated implementation to solve more problems. For example, the jQuery framework is a framework that implements Javascript’s API compatibility on the PC side ( Zepto (for mobile terminals), the MVVM framework is designed to quickly build an encapsulated implementation of the interface. By encapsulating DOM operations, it reduces manual DOM operations and focuses on the implementation of data structure and business logic.

For more programming related knowledge, please visit: Programming Video! !

The above is the detailed content of What are the three foundations of the front-end?. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：How to use javascript random methodNext article：How to use javascript random method

See more

What are the three foundations of the front-end?

Related articles