4.17. Introduction to HTML: basic structure, tags and attributes: CSS Selectors
Page 21 | Listen in audio
Introduction to HTML
HTML, which stands for Hyper Text Markup Language, is the standard markup language for creating web pages and applications. Along with CSS and JavaScript, HTML is a fundamental technology used on most websites. HTML provides the structure of a web page, while CSS styles this structure and JavaScript allows for interactivity on the page.
Basic structure of an HTML document
An HTML document has a tree structure, which starts with a root element <html>. This element contains two child elements: <head> and <body>. The <head> contains metadata about the document, while the <body> contains the main content of the document.
<html>
<head>
<title>Page Title</title>
</head>
<body>
Page content...
</body>
</html>
HTML Tags and Attributes
HTML tags are used to define HTML elements. Each HTML tag begins with the angle bracket (<) and ends with the angle bracket (>). Most HTML tags have an opening tag and a closing tag, with content in between. For example, <p>Text</p>.
HTML attributes are used to provide additional information about elements. They are always specified in the opening tag and usually come in name/value pairs. For example, <a href="https://www.example.com">Link</a>.
Introduction to CSS Selectors
Cascading Style Sheets (CSS) is a style sheet language used to describe the appearance of a document written in HTML. CSS describes how HTML elements should be displayed, controlling the layout of multiple pages at once.
CSS Selectors
CSS selectors are used to select the HTML elements you want to style. There are several types of CSS selectors, including type selectors, class selectors, ID selectors, attribute selectors, and more.
- Type Selectors: Select elements based on the element type. For example, 'p' will select all elements <p>.
- Class Selectors: Select elements based on class attribute. For example, '.intro' will select all elements with class="intro".
- ID Selectors: Select elements based on the ID attribute. For example, '#firstName' will select the element with id="firstName".
- Attribute Selectors: Select elements based on an attribute or attribute value. For example, '[target="_blank"]' will select all elements with target="_blank".
To conclude, HTML, CSS and JavaScript are essential technologies for becoming a front-end developer. Learning the basic structure of HTML, HTML tags and attributes, and CSS selectors is the first step towards becoming a professional web developer. The next step is to learn how to use JavaScript to add interactivity to your web pages.
Now answer the exercise about the content:
What is the function of CSS selectors?
You are right! Congratulations, now go to the next page
You missed! Try again.
Next page of the Free Ebook:
22Introduction to HTML: basic structure, tags and attributes: CSS properties and values
4 minutes
Earn your Certificate for this Course for Free! by downloading the Cursa app and reading the ebook there. Available on Google Play or App Store!
