View video tutorial

CSS Editors

CSS

A good text editor helps us learn quickly.

CSS in Notepad or Notepad++


A simple text editor like Notepad or Notepad++ is sufficient for learning CSS.

1. Writing CSS in Notepad or TextEdit



Open the Start Screen (the window symbol at the bottom-left on the screen). Type Notepad. and Enter.

notepad

Open the editor and type the following code.

notepad

Save file to any location in your computer by any file name for example index.html, Save type as:All files (*)

notepad

Open file in any of your browsers.

notepad

Output looks like below.

notepad

Congratulations! you successfully write and run an HTML and CSS program.

2. CSS in Integrated Development Environment(IDE)


The IDE is a text editor with enhanced functionality for software development.

A professional text editor is the best choice for a practical project or any complex project.

IDE is the professional and commercial choice for software developments.

Some common IDEs are:

Visual Studio Code (Using Visual Studio Code)

Visual Studio

Eclipse IDE

NetBeans IDE

IntelliJ

Atom

Sublime Text

3. Learn CSS using online editor


There are many online text editors available on the internet that can be used to learn CSS.

w3context has an online text editor that can also be used to learn CSS.

Example

<!DOCTYPE html>
<html>
<head>
  <title>CSS Example</title>
  <style>
    body{
      background-color: rgb(223, 217, 197);
    }
  </style>
</head>
<body>
  <p>CSS Example</p>
  <h1>CSS in Notepad</h1>
  <p>A simple text editor like Notepad or 
    Notepad++ is ok for learning CSS.</p>
</body>
</html>
Try it Now »

Click on the "Try it Now" button to see how it works.