DEV Community

Cover image for Beginner's Guide to HTML & CSS
Rajshree Vatsa
Rajshree Vatsa

Posted on

Beginner's Guide to HTML & CSS

What is HTML?

 Hyper Text Markup Language commonly known as HTML, the standard markup language that is used for creating Web pages and Web applications. HTML provides a description of the structure/layout of a web page.

How it works?

 For a browser to correctly render a web page, it must be explicitly told what each piece of content is. This is where the markup language elements comes in use.
We define the structure of webpage/ web application by wrapping content in HTML elements. The head element contains supporting information about the file, commonly referred to as metadata. There must be a title (providing the webpage a title) directly underneath the head element in order be complete. The head element may also contain links to Javascript files and CSS stylesheetsbody is the element that holds the information that is rendered by a web browser. There can be only one body element within an HTML file.

<!DOCTYPE html>
<html>
<head>
<title>Basic HTML Page </title>
</head>
<body>

<h1>First Heading</h1>
<p>First paragraph.</p>

</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Features of Html:

1. HTML is very easy and simple and can be easily understood as a beginner.
2.HTML is useful to make an effective presentation because it has a lot of formatting tags.

  1. HTML can be displayed on any platform like Windows, Linux, and Mac etc. 4.HTML is a case-insensitive language, which means we can use tags either in lower-case or upper-case.

WHAT is CSS?

 Cascading Style Sheets (CSS) describes how HTML elements are to be displayed on screen, paper, or in other media.  It is a style sheet language which is used to enhance the look and formatting of a document written in markup language. It provides an additional feature to HTML. It is generally used with HTML to change the style of web pages and user interfaces. It can also be used with any kind of XML documents including plain XML, SVG and XUL.

body {
  background-color: blue;
}

h1 {
  color: cyan;
  text-align: center;
}

p {
  font-family: sans-serif;
  font-size: 15px;
}
Enter fullscreen mode Exit fullscreen mode

Why is it used?

1.If you are developing a large website where fonts and color _ information are added on every single page, it will be become a long and expensive process. CSS was created to solve this problem. It was a W3C recommendation.
2.CSS style definitions are saved in __external
_ CSS files so the entire website look can be changed/modified by changing just the CSS file.
3.CSS provides more attributes than plain markup language, it also makes websites appear visually appealing.

Online Resources to learn HTML & CSS for free:

1.Freecodecamp.org
2.Codeacademy
3.Udacity
4.W3schools
5.linkedIN learning

Some of the helpful books:

1.Smashing CSS
2.Head First HTML and CSS
3.Styling with CSS
4.Learning Web Designs
5.Core HTML5 Canvas

Conclusion

I hope it was helpful for you. Do comment for more.
My github :https://github.com/RajshreeVats

Discussion (6)

Collapse
swarnabhagat profile image
SWARNA BHAGAT

This is so helpful.It contains everything a beginner need to know.👍

Collapse
rajshreevats profile image
Rajshree Vatsa Author

(❁´◡`❁)

Collapse
chetan_atrawalkar profile image
Chetan Atrawalkar👉CA.

Very nice and useful Post👍

Collapse
rajshreevats profile image
Rajshree Vatsa Author

Thanks Chetan :)

Collapse
sidcraftscode profile image
Siddharth Chaudhary

Nice article

Collapse
rajshreevats profile image
Rajshree Vatsa Author

Thanks :)