Chapter 36: HTML and CSS
HTML (HyperText Markup Language) and CSS (Cascading Style Sheets) are two of the main technologies used to build web pages. HTML provides the structure of the page, while CSS is used to control the presentation, i.e. layout and design. Both are fundamental to any logic programming course, as they form the foundation for building websites and web applications.
HTML
HTML is a markup language that is used to structure and present content on the web. It is made up of a series of elements, which you can think of as the building blocks of a webpage. Each element has a specific function and helps to structure the content of the page. For example, the element <h1> is used for headings, while <p> is used for paragraphs.
In addition, HTML elements can have attributes, which are additional information that modify the behavior or appearance of the element. For example, the 'href' attribute on the <a> specifies the URL to which the link should lead.
HTML elements are nested, which means they can contain other elements. For example, a <body> may contain <h1>, <p>, and <a> elements. This nested structure is what gives web pages their hierarchical structure and is fundamental to the way HTML works.
Example HTML
<!DOCTYPE html>
<html>
<head>
<title>Example HTML</title>
</head>
<body>
<h1>Hello world!</h1>
<p>This is an example of an HTML page.</p>
</body>
</html>
CSS
CSS is a style sheet language that is used to describe the appearance and formatting of a document written in HTML. It lets you control things like colors, fonts, spacing, layout, and more.
CSS is made up of style rules, each of which consists of a selector and a declaration block. The selector determines which HTML elements the rule applies to, while the declaration block contains one or more declarations that specify how the selected elements are to be styled.
Each declaration consists of a property and a value. The property specifies which aspect of the presentation will change, and the value specifies how it will change. For example, the statement 'color: red;' changes the text color of selected elements to red.
Example CSS
h1 {
color: red;
fontsize: 24px;
}
P {
color: blue;
fontsize: 16px;
}
In summary, HTML and CSS are two of the main technologies used to build web pages. HTML is used to structure the page's content, while CSS is used to control the presentation. Both are fundamental to programming logic and are essential for anyone wanting to build websites or web applications.
