How to create a simple CSS stylesheet using Notepad

Video: CSS Tutorial How to create css style sheet in Notepad ++?

Content

Steps
Tips
Things You’ll Need

Notepad is one of the text editors that can be used to create a Cascading Style Sheet (CSS) document. After creating a CSS file in Notepad, you can link that file to a web page so that the content of the web page can be formatted with your stylesheet.

Steps

1 Open the Notepad program.
2Copy the following code:

@charset "utf-8"; / * CSS Document * // * Define the body element's color * / body {background: # FFFFFF;} / * This section is for links * / a: link { font-weight: normal; color: Navy} a: visited {font-weight: normal; color: Green;} a: hover {font-weight: bold; color: Red; font-variant: small-caps;} / * This section is for a paragraph section * / p {font-style: italic; font-size: 18px;} blue {color: # 0000FF;} / * This section is for the image's black border. * / img {border-color: # 000000; border: thick; border-style: ridge;}

# Paste the code from "Step 2" into Notepad.

1 Save the file in Notepad. Save it under the name "SimpleCSS.css" by clicking the "File" button and choosing the "Save" command. After clicking the "Save" button, the "Save As" dialog box will be displayed.
2 Name your CSS file. Enter "SimpleCSS.css" or any name in the "File Name" text box with a ".css" extension.
3 Click the "Save" button.
4 It is done!

Tips

Save the Notepad file as Text Only (sometimes you might call it Text Document or ASCII) and give it the ".css" extension.
The code we wrote here is just an example to show you how to create a basic CSS file using Notepad to manipulate its HTML elements in our sample web page displayed in the Introduction section. You can change our CSS coding, however, how you want to format the styles and appearance of the web pages.
Remember to place the saved CSS document in the same folder as your HTML documents where you created your web pages.
After you've created your CSS document, you may need to take the next step; that is, link a document and a web page. Please see the related articles in order to do this.