Html css front-end basic learning methods and experience sharing, css Experience Sharing

Html css front-end basic learning methods and experience sharing, css Experience Sharing

Preface:

On the first day of admission, I would like to share some of my learning methods and experience on front-end html css. I love the front-end, but I don't know where to start. I am still confused with new friends. Of course, different learning methods are suitable for everyone. The following is for your reference only.

1. Basic syntax

The basic syntax is not explained here. If you need it, you can learn it at w3cschool, w3school, and MOOC. If you are new to the front-end, you are not recommended to learn through books. First, the knowledge in books may be too old and has been abandoned in new versions. Second, the Knowledge System in books is comprehensive, A lot of knowledge may be hard to understand, and it is rarely used for projects at ordinary times. If you finish a book from start to end, it will take a lot of time to spend, and the knowledge update iteration on the front end is fast, therefore, quick learning is a primary capability to be developed.

Now html5 and css3 have been very popular, but at the beginning, we must first learn html4.0 and css2.0. At this time, do not use the labels and syntaxes discarded in the new version. When you learn html5 and css3, you can focus on the new part, that is, pay attention to the difference.

Ii. Editor

The editor is used to improve development efficiency. Of course, dreamweaver is not recommended. Beginners can use some small editors, Notepad ++, EditPlus, sublime, HBulider is a good choice. Webstorm should be the best compiler and the most popular. Of course, it is also very large and suitable for later project development.

HBulider does not support plug-in installation. All functions are integrated, and its code prompt function is perfect. It is sufficient for early learning. Sublime requires you to install the plug-in by yourself. There are also many tutorials on the Internet. I will not go into details here. It should be noted that when you download the editor, you must go to the official website to download it, do not directly use an editor that has been installed with plug-ins. Although the editor is just a tool, it should not take more time to study a tool than to study the code, many tutorials on the Internet are clearly explained. However, when you do it yourself, you may encounter various problems. Therefore, you must step on some pitfalls, you can have a deeper understanding.

Iii. Code specifications

The code is not well written, and the final result implementation is only a small part. The Code standardization and semantics in the programming process are particularly important, if the code you write does not understand what you write the next day, it will be a disaster for demand changes and code maintenance. At the same time, because the code structure is not clear and the code is not standardized, it is also easy to cause errors and is not easy to find. Therefore, from the very beginning, we should develop good coding habits and pay attention to details, which will certainly help you learn programming more smoothly.

In the process of coding, we should try to follow the xhtml standard, which is a more rigorous standard html Version.

4. Exercise

After learning the basic syntax, you can create it on the page you want to implement. Only by having more exercises can you step on more pitfalls. Then, you can solve the problem by checking the materials, in order to further understand what we have learned, so as to achieve better integration. Of course, it is also important to be good at summing up.

If you have not found a suitable page for exercises, you can first imitate a small module of some large websites. Through F12, you can open the console and view the source code of the webpage. Of course, you can also download some psd design documents for page restoration.

V. Cut Graph

Cropping mainly involves Photoshop's cutting tool, painting slices, and storing them as the web format. Other details can be learned step by step during use.

6. knowledge points to be mastered in the basic stage

Any technology does not have to wait until you fully understand the principles and are fully proficient in it to do the project. It is necessary to do more project exercises on a certain basis and gradually go deep. Therefore, in particular, in the knowledge reserve stage, it must be faster than the foundation, and then continue to accumulate experience in project exercises.

The following is a brief description of the Knowledge modules to be mastered in the basic phase, so as to have a holistic grasp:

Conclusion:

I was born with a sense of depth and breadth. With my love and reverence, I continued to expand the depth and breadth of my knowledge and use it in my work and life, it is almost an interpretation of happiness. You see the world and the world see you!