What software should CSS beginners choose?

I want to take this article as the prelude to the css basic tutorial. From today on, I have translated and sorted out the basic css knowledge I have learned since designing the web page. This tutorial is divided into N parts and published separately. Several Articles irrelevant to the tutorial may be inserted. There is no specific progress for posting the tutorial. We recommend that you subscribe to the Feed on this site. The original version 30%-50% of the tutorial content is Jorux, and the rest of the translation content is free translation, which may come from multiple foreign sites and will be published at the end of the tutorial.

I have translated a css tutorial: I learned how to build a website with css in ten steps. The article claims that I can learn how to build a website in ten steps. Although exaggerated, I can indeed learn something, just like the rapid development of modern society, it is just a css fast food. To use css freely, there may be no hundred or eighty steps.

What software is required to learn css?

A text editor and Firefox

1. Text Editor: it refers to notepad software of notepad edition, such as windows and Editplus. It is not recommended that you use Dreamweaver, Frontpage, or other software that has graphical visual operations and does not directly edit css source code. This type of software can help you quickly fulfill your wishes at the early stage of learning css, but soon you will find that these css codes automatically generated by Dreamweaver are lengthy and cumbersome, and the size of css files increases. Once you leave these software, your mind will be like a blank piece of white paper, and the basic css syntax cannot be remembered. I have taken a detour and hope my css beginners can learn from me.

Helper house www.bkjia.com

I use Editplus to write web Code. It is an enhanced version of notepad and has multiple-step Undo, syntax highlighted, all replace, and other functions. I do not need to set it after installation. We recommend that you change the screen font to Verdana on the 14th, easy to read and write.

2. Firefox: I am not a Fan of Firefox, and it is not a fuel-saving Lamp (occupying more memory ). But as a free software, coupled with appropriate plug-ins, is a necessary tool for web designers, how to use and select plug-ins to reflect the professional quality of designers. We recommend that you install the following plug-ins:

Required plug-ins:

IE Tab: Excellent plug-ins for debugging web pages in the IE kernel browser. If you like it or not, please install it!

We strongly recommend that you install the following plug-ins:

Web Developer: It is so powerful that I have not used all of its functions, but it directly views the css code function of the webpage and displays the page information, and the function of verifying css and Html is very practical.

ColorZilla: easy to extract the color of any element in the webpage.

Html Validator: After the plug-in is installed, an icon is generated in the lower right corner of the browser. The green check mark indicates that the Html of the current webpage has been verified, and the Red Cross sign indicates that the Html has an error, A yellow exclamation mark indicates that Html has a warning statement that cannot pass verification. Double-click the icon to highlight the number, location, and modification suggestions of statements that cannot pass verification on the webpage. As a designer, it is best to develop the habit of observing this icon at any time, and you will find that almost all web pages that claim to pass verification on the Internet are errors or warnings. This website has passed verification except for a few webpages.

FireBug: After the plug-in is installed, an icon is generated in the lower right corner of the browser. The green check mark indicates that the Javascript code on the current webpage has been verified and debug the wrong Javascript code. We do not need this function for the moment. The required function is its Inspector. You need to drag the "glasses" icon of Inspector into the toolbar by customizing the toolbar. Click the Inspector icon and move the mouse to any position on the webpage. You can see the corresponding source code of the webpage Html file in the lower window, which is very useful for webpage debugging.

Isn't it a little tiring to install so many plug-ins? I can't afford to write all the plug-ins, so take a break and go to the text section of the css tutorial in the next article.