Subtitles of the Movie

CSS - let's talk about it. Style sheets are documents or sections of documents that specify a set of rules with instructions for wide range formatting including fonts, layouts and colors and such. You have three options or three flavors of style sheets. You have the external style sheet, which keeps the style sheet in a separate document and that's usually labeled .css. Embedded style sheets - keep style rules within an HTML document and that's usually embedded in the head. Inline style-sheets - apply style rules within an HTML tag, and that's what we did before. We added a style sheet within the HTML. External - an external style sheet is a collection of rules that are kept in a file with a doc css extension, separate from the HTML file. This is the preferred method of style sheets. The code for linking of a style sheet to one or all of your documents looks like this below. And this is the actual link - you would place this in all your HTML pages and place your rules inside of this file called simple.css. To associate the link, a link tag is placed in the head of the document with the following attributes. The ‘href’ tag specifies the URL or path name and file of the style sheet - that's the first part. Part two is the rel, the relationship attribute, with the value of style sheet specifies that the linked document is a style sheet. The type attribute, with a value of text slash css, specifies a cascading style sheet as a document. Since a style sheet is nothing more than a text file you can create a style sheet and external style sheet with notepad or simple text. Embedded style sheets can be placed within the document, this is done by nesting, style open and style close tags, within the head element of the document, and placing the style rules within the style. Embedded styles are a good place for style rules to apply one or more elements within a document. So using embedded style sheets can be pretty powerful. The final method - the inline styles, these style rules are applied to a single element or segment of a page. A better example of this, is a style that can be included within an HTML tag like this. Here is the h1, this is an HTML tag, and we hit space, then we type style, equals, and then of course you put the rules here, close, and then this is the actual content heading here, and then the close of the tag. Warning - an inline style will override any conflicting rules with external or embedded style sheets. Style rule syntax - a selector which is an element that will be modified by the rule and a declaration that modifies the rule. Ok so what do we have here? We have selector, properties and values. Selector is the h1 tag. Property could be font - size. Then we have the ‘is’ or ‘equal to’ - the value 12 points, 10 points, 15 points, and what have you. And of course you have the curly brackets on both sides, which create a declaration. Properties and values - properties and values are similar to HTML. Here is a property and value, we'll say font - size is 12, for an HTML it’s translated font space color ‘is’ or ‘equal to’ blue. So you could see how they are relational. Value is not enclosed in quotes. A property and value are separated by a colon. Each declaration must be followed by a semicolon or closing brace, this example syntax, body is the actual HTML tag that you are applying the rules to. Background dash color is green; semicolon which is a separator. Panning is 5 pixels, px, semicolon, and then you would close out of the curly brace. This code below is written in separate lines for easy reading. Paragraph tag, which is effecting paragraphs. Open curly brace, tags, dash, indent, is, (that should be a colon) is 0.5 inches. Font is Ariel semicolon, and enclose curly brace. More info - style sheets are not case sensitive, and does not recognize white space in between characters that is greater than a single character space. Why are they cascading? This is demystifying style sheets overall. If you have an external style sheet it’s overridden by an embedded style sheet. And if you have an inline style sheet it’s overridden by inline, ok. So inline is the boss, he is the assistant and he is below the assistant. So the rules for inline override embedded, and embedded override external. And that's why they are cascading, it is because they override each other. nline override embedded, and embedded override external. And that's why they are cascading, it is because they override each other.