CSS and HTML are the core languages used for creating web pages and web-based applications.
HTML creates the structure and content of a webpage with text, images, links, and containers, while CSS modifies the design and display of those items in the HTML page.
HTML is made up of content between tags: <tag>Content here</tag>.
CSS is made of selectors followed by a declaration block: selector {declaration block}.
HTML example:
In the HTML example above, we create a heading and paragraph elements.
CSS example:
In the CSS example above, we set the HTML <p> elements content to the color red, and the font size of the <h2> element’s content to 24 pixels.
HTML & CSS in the Browser
HTML and CSS are languages used by browsers to present information to the users.
An HTML web page will display text, images, links, and containers, but has little control over how that content appears.
A CSS document will provide the rules for how the text, images, links, and containers should appear — whether it’s setting text to bold or italic, setting width, height, and position for an image or container. If a .css file is opened in a browser, the browser would just display the CSS code exactly as it is written in a code editor.
Let’s say we have 2 files:
HTML file:
CSS file:
Loading only the HTML file gives the paragraph mentioned above.
Loading both files gives the paragraph mentioned above and colors it green.
However, loading just the CSS file will only show the text p {color: green;}.
