How to Start writing HTML and CSS ?
Well we first need a Editing software. My personal recommendation is VS Code short for Visual Studio Code by Microsoft. Visual Studio Code combines the simplicity of a source code editor with powerful developer tooling, like IntelliSense code completion and debugging. It is Available for macOS, Linux, and Windows.
You can Download and install VC Code by following the links below for:
Aldo VS Code is a powerful code editing software, there are many more out there.
This are some of the most populare ones:
- Syntax Highlighting and Syntax Folding
- User Defined Syntax Highlighting and Folding: screenshot 1, screenshot 2, screenshot 3 and screenshot 4
- PCRE (Perl Compatible Regular Expression) Search/Replace
- GUI entirely customizable: minimalist, tab with close button, multi-line tab, vertical tab and vertical document list
- Document Map
- Auto-completion: Word completion, Function completion and Function parameters hint
- Multi-Document (Tab interface)
- WYSIWYG (Printing)
- Zoom in and zoom out
- Multi-Language environment supported
- Macro recording and playback
- Launch with different arguments
2. Sublime Text
1. Easy to navigate interface
2. Supports Command Palettes
3. Special Developer Tools
4. Package Manager Integrated for Plugins support
5. Customizing UI is easier as compared to other code editors
Atom works across operating systems. Use it on OS X, Windows, or Linux.
Atom helps you write code faster with a smart and flexible autocomplete.
Split your Atom interface into multiple panes to compare and edit code across files.
Built-in package manager
Search for and install new packages or create your own right from Atom.
File system browser
Easily browse and open a single file, a whole project, or multiple projects in one window.
Find and replace
Find, preview, and replace text as you type in a file or across all your projects.
And there are many more:
There are all more ore lass the same with slight differences. But at the end of the day the best software solution for You is the one you know best and are the most efficient in it.
Now getting beck to VS Code, the naked Brut version of VS Code for HTML and CSS is not that helpful. That is why there are a lot of Extensions that help with your productivity.
Just follow the link, install VS Code and on the left click on the Extensions tab to see all the extensions available. You can then search for the once you need in the search bar at the top left.
Some of the most popular extensions for HTML and CSS are:
* Live Server
- A Quick Development Live Server with live browser reload.
Live Sass Compiler
- Live SASS & SCSS Compile.
* Auto Rename Tag
- Automatically rename paired HTML/XML tag, same as Visual Studio IDE does.
Bracket Pair Colorizer
- This extension allows matching brackets to be identified with colours. The user can define which characters to match, and which colours to use.
Code Spell Checker
- A basic spell checker that works well with camelCase code.
HTML CSS Support
- Class attribute completion.
- CSS Peek