A stylesheet is a file or a section of a file that defines the presentation and visual style of a document written in a markup language such as HTML. It contains rules and properties that specify how elements should be displayed on a web page, including layout, colors, fonts, and other stylistic attributes.
Stylesheets are used to separate the content of a web document from its presentation. By using stylesheets, developers can maintain a consistent look and feel across multiple web pages and make it easier to update the design without altering the HTML content. The most common language used for stylesheets is CSS (Cascading Style Sheets).
Example (CSS Stylesheet):
Here is an example of a simple CSS stylesheet:
/* Define the body element style */
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
margin: 0;
padding: 0;
}
/* Style for h1 elements */
h1 {
color: #333;
text-align: center;
}
/* Style for paragraphs */
p {
font-size: 16px;
line-height: 1.5;
color: #666;
}
/* Style for a class called .button */
.button {
background-color: #007BFF;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
}
/* Style for an ID called #header */
#header {
background-color: #333;
color: white;
padding: 20px;
text-align: center;
}
In this example, the stylesheet contains rules that apply styles to different HTML elements such as body
, h1
, and p
, as well as elements with specific classes (e.g., .button
) and IDs (e.g., #header
).