.,\nCSS is a powerful tool for positioning elements on the screen.,\nNote that while this is a very basic change, it can be coupled with more CSS and HTML to create a beautiful two column layout.\n\n,\nA completed internal CSS style sheet along with a HTML document would look like this:\n\n,\nThis style sheet creates a margin of 15 pixels to the left of all paragraphs.", "totalTime": "PT9M", "estimatedCost": { "@type": "MonetaryAmount", "currency": "USD", "value": "0" }, "step": [ { "@type": "HowToStep", "position": 1, "name": "Step 1: Understand the anatomy of a CSS Style.", "text": "CSS is a simple and straightforward language. A CSS style is made up of three key parts. Take this CSS code snippet: p {color: red; font-size: 2em;}. This style makes all paragraph's(data enclosed in

tags) red and increases the font size. The three parts are called the selector, the declaration block, and the declarations. The selector in our example is the p before the opening brace. A selector defines which part of the HTML will receive the style(in this case HTML paragraphs). The declaration block in our example is everything from the opening brace to the closing brace. The declaration block is made up of declarations for that style. A style will have only one declaration block. Our example actually has two declarations. They are color: red; and font-size: 2em;. Declarations tell what you want to do with the element defined in the selector of the style. You can have as many declarations as you want in a style. ,, In a CSS style, declarations are what defines what part of the element you want to style and how it should appear. For example to turn this text red the declaration is color: red; (this example actually uses the HTML font tag because LifeGuide Hub's editor doesn't support some of the CSS needed). Make sure you end declarations with a semicolon. , Possible values: blue, red, or a hex code. font-weight: changes font to bold, italics, etc. Possible values: bold, italic. text-align: aligns text. Possible values: right, left, center. border: changes or creates a border around the selected element. A possible value could be border: 1px solid red. This creates a border 1 pixel in size that is solid and red in color. margin: this creates a margin around the selected element. A possible value is margin-left: 5px. This creates adds five pixels of empty space to the top of the element. background-color: changes the background. Possible values: red, black, and hex code.", "url": "https://www.lifeguidehubb.com/categories/fashion-style/how-to-style-a-page-using-css#step-1" }, { "@type": "HowToStep", "position": 2, "name": "Step 2: Create a style sheet with styles for each element of the page you would like to style.", "text": "Many sites use more complex declarations for positioning among other things. , Style Sheets consist of many styles all together. There are three types of style sheets: External style sheets are text files saved with the .css extension. They are linked to an HTML document using the tag. Internal style sheets are styles defined in the .", "text": "include