CSS Tools and Info


Premium Content - Free Preview

Developer Tools

One of the most important tools for dealing with CSS come with your browser - the developer tools. All the major browsers include a version of developer tools. To inspect the HTML and CSS for any element on a page, simply right-click on the element and click on "Inspect Element". This will open up the Dev tools, here is Chrome's:

The HTML appears on the left side and the CSS on the right. You can edit the HTML and CSS in the dev tools to immediately see how it looks on the page, and then you can copy the code into your actual files. See CSS conflicts for more on the dev tools.

Code Editors

As mentioned in Creating Web Pages, Adobe Brackets is a good text editor for coding HTML and CSS. Brackets can also be connected with your browser so you can view a live preview as you code.

Tools to Create Sites discussed some tools that let you create sites with coding. You should use a tool that lets still you edit the code when needed, such as Microsoft's Expression Web (which is free but no longer developed). There are also many online tools, such as Jetstrap for developing sites with the Bootstrap CSS framework.


End of Free Content Preview. Please Sign in or Sign up to buy premium content.

Contact Us