HOW TO STYLE HTML USING EXTERNAL CSS
CASCADING STYLE SHEETS (CSS)
CSS stands for Cascading style sheets. Cascading means that everything applied to the parent element is also applied to all other elements (children elements) found inside the parent element. In practical example, this means that if the color of the body element is "magenta", then all headings, paragraphs etc found inside the body element will all have the "magneta" color, well, uness otherwise stated. CSS saves a lot of work as it controls the layouts of multiple web pages all at the same time. With CSS, a lot of features csn be achieved such as spacing between elements, how elements are positioned, how elements are laid out, size of texts, the background color, background images, different displays for different devices and screens, fonts, color and a lot more of other features.
HOW CSS CAN BE ADDED IN AN HTML ELEMENT CSS can be added in an HTML element in three ways such as; •INLINE: This means using the style attribute in HTML elements. The inline CSS is used to apply a unique style to single HTML. It uses the style attribute of an HTML element.
•INTERNAL: This means using style element in the head section.
•EXTERNAL: This means using the link element to link the HTML to an external CSS file.
EXTERNAL CSS
An external style sheet is simple a litong of CSS rules. It cannot contain HTML tags. An external style sheet is a separate CSS file that can be accessed by creating a link within the head section of the webpage. Multiple webpages can use same link to access the stylesheet. The external style sheet can be written in any text editor. The file is always created separately and saved with a .css extension. The external CSS style is used to define the style for many HTML pages. This also means adding a link to the section in every HTML page. There's no limit to the number of external style sheets a single HTML page can contain. Also external HTML stylesheets can be combined with embedded style sheets.
HOW TO AN EXTERNAL CSS FILE An external CSS file can be created thus;
- Tap on the desktop to create a new file
- Click on the file, then "save as" to save the file as "CSS"
- Open your videos/ pictures/ audio to select a desires file.
- Drag the desires file to the ready created new file on desktop.
- Navigate and drag the already saved file to your workspace.
- Then go to your HTML and add the Link tag to the body.
- Add the src, width, length to the picture andto the audio and video, add the src, width, control lool, etc, as desired.
- Then create a new file on workspace where the background and colour will be styled using same information as seen in the HTML.
A CSS FILE MAY NOT WORK IF; If you put the link tag inside a header like title. The external CSS can only be put in the body tag. However, to load the style before loading the page content, the external CSS style can then be put in the head tag.