Download to read offline
More Related Content
DW unit 3.pptx
- 1. D.Seethalakshmi MCA.,M.Phil., Assistant Professor BonScours College for Women, Thanjavur
- 2. ā¢ Defining CascadeStyle Sheets ā¢ Working with the CSS styles and Panel ā¢ Creating a New CSS Rule ā¢ Working with External CSS Style Sheets ā¢ Working with CSS layouts ā¢ Working with AP Div Element
- 3. ā¢ CSS isa collection of formatting rules, known as CSS rules, which controls the appearance of content in a web page. ā¢ Styles can be specified inside a single HTML element, <head>. ā¢ Multiple external style sheets referenced inside a single HTML document. ā¢ CSS elements within a webpage by using rectangular boxes known as Absolute Positioned elements.
- 4. ā¢ AP Elementsare used to hold and place the content of the web page. ā¢ The AP element are used to hold and place the content of the web page. ā¢ The AP element act as a container for text, images & tables occupies a certain area on the web page. ā¢ Create a web page layout using CSS, notice the use of <div> tags. ā¢ Draw AP Div tool, inserts a <div> tag in the HTML code of the web page. ā¢ The AP element the <div> tag is known as an AP Div element.
- 5. ā¢ CSS definingrules reside either in an external CSS file or HTML code of web page, normally in the head section of HTML code. ā¢ CSS rules are the styles that are applied on the HTML elements, Such as font, images & tables of a Web page. ā¢ CSS rules consist of 2 parts, selector & declaration. ā¢ Selector part describes the formatted element, such as headings, paragraphs & id name. ā¢ The code specified between the curly braces ({}) is the declaration part. ā¢ Each declaration part is further divided into 2 parts, property and value.
- 6. ā¢ External CSS ā¢All CSS rules are collectively stored in a separate, external CSS files with the .CSS extension. ā¢ Internal CSS CSS rules are stored in a style tag in a head portion of the associated HTML document. ā¢ Inline Style ā¢ CSS code that resides within specific instances of tags throughout an HTML document.
- 7. ā¢ A CSSrule-set consists of a selector and a declaration block: ā¢ The selector points to the HTML element you want to style. ā¢ The declaration block contains one or more declarations separated by semicolons. ā¢ Each declaration includes a CSS property name and a value, separated by a colon. ā¢ Multiple CSS declarations are separated with semicolons, and declaration blocks are surrounded by curly brace
- 8. ā¢ Shorthand propertiesare CSS properties that let you set the values of multiple other CSS properties simultaneously. Using a shorthand property, you can write more concise (and often more readable) style sheets, saving time and energy. ā¢ the CSS specification defines shorthand properties to group the definition of common properties acting on the same theme. For instance, the CSS background property is a shorthand property that's able to define the values of background-color, background-image, background- repeat, and background-position. Similarly, the most common font-related properties can be defined using the shorthand font, and the different margins around a box can be defined using the margin shorthand.
- 9. ā¢ Launch theCSS panel by choosing Window > CSS Styles. ā¢ A. Show Category View. ā¢ B. Show List View. C. Show Only Set Properties. ā¢ D. Internal Style Sheet. ā¢ E. CSS panel menu. ā¢ F. Switch to Current Selection Mode. G. Rules pane. ā¢ H. Properties pane. ā¢ I. Attach Style Sheet. ā¢ J. New CSS Rule. ā¢ K. Edit Style Sheet. L. Disable/Enable CSS Property. M. Delete
- 10. ā¢ CSS stylepreferences control how Dreamweaver writes the code that defines CSS styles. CSS styles can be written in a shorthand form that some people find easier to work with. Select Edit > Preferences ā¢ When creating CSS rules : controls the shorthand rules at the time of creating CSS rules. ā¢ When editing CSS rules : controls the shorthand rules in the existing style sheet. ā¢ When double clicking in CSS panel: selects a tool for editing CSS rules.
- 18. ā¢ Can easilyedit CSS rules from an internal and external CSS file. ā¢ Edit a CSS file that controls the text in web page. ā¢ Edit an external style sheets, it affects all the documents linked to the external style sheet.
- 28. ā¢ Easily movethe CSS rules to different locations. ā¢ Eg from one web page to another web page o from one web page to an external style sheet.
- 31. ā¢ An externalstyle sheet enables to create styles can apply to all the web pages through out a website. ā¢ An external style sheet store the style sheet information in a separate CSS file. ā¢ Define styles for common formatting used in the entire sheet, such as headings, captions and even images. ā¢ Applying multiple formatting options to elements fast and easy.
- 37. ā¢ Attach anyexternal style sheet to the web page with the attach style sheet command in the CSS STYLES panel. ā¢ The steps are ā¢ Open the web page where we want to link an external style sheet ā¢ Click attach style sheet button in CSS STYLES Panel.
- 41. ā¢ It providesto develop own style sheets.