See a good front-end process, share it here~
The right direction is worth more effort:
The first stage - HTML learning: HyperText Mark-up Language (HyperText Mark-up Language) is the skeleton of a web page. Whether it is a static web page or a dynamic web page, the HTML code is finally returned to the browser, and the browser interprets and renders the HTML code. and then presented to the user.
HTML learning is a process of memory and understanding. During learning, you can use DW's split "view-assisted learning", see the effect in the "design" view, and learn the essence in the "code". The production method of "raw material".
The second stage - CSS learning: Cascading Style Sheets, a style design language that truly separates web page performance from content, which greatly improves the development speed and reduces maintenance costs.
The box model, relative layout, absolute layout, etc. in css can achieve pixel-level precise control of the position and layout of each object in the web page.
The third stage - JavaScript : It is a scripting language widely used on the client side, providing some built-in functions, objects and DOM operations, with which some client-side special effects, validation, interaction, etc. can be achieved to make the page look Not so dull.
About compatibility: It's a headache.
The fourth stage - jQUery: is a free, open source, lightweight JavaScript library, and compatible with various browsers (jQuery2.0 and subsequent versions abandoned support for IE6/7/8 browsers), and now there are Many jQuery-based plug-ins are available, which is more convenient and quick to realize some rich dynamic effects, greatly saves development time, and improves development speed, which fully reflects its core purpose of write less, do more
Bootstrap: It is an open source toolkit for front-end development launched by Twriter. It is a css/HTML framework and supports responsive layout. It has always been a popular open source project on GitHub.
In the process of project development, you can quickly complete page layout and style settings with the help of CSS styles, components, and JavaScript plug-ins provided by Bootstrap, and then fine-tune styles in a targeted manner, which greatly shortens the development cycle for framework-based development.
Suggestions from others: Many beginners lack the overall analysis of the page layout, and cannot grasp the nested relationship between the boxes in the page at a macro level, so they rush to do it. Misalignment when floating, etc. It is recommended to adopt the idea of " top-down, gradual refinement ", first use several boxes to divide the page as a whole, and then gradually continue to nest boxes in the boxes.
I also need to browse more excellent websites, be good at analyzing and refer to design ideas and layout methods, and be well-informed, so as to integrate and use the strengths of others for my use.