Download to read offline
Uploaded bySumit Rana
Css how to insert css
This document discusses three ways to insert CSS styles into HTML: inline styles, internal styles, and external styles. Inline styles use the style attribute within individual HTML elements. Internal styles define CSS rules within the <style> tags in the <head> section and can affect multiple elements. External styles link to an external CSS file with the <link> tag and allow one CSS file to style multiple pages. The document provides examples of each method and compares their usage and scope.
EducationâŚ
More Related Content
![Cascading style sheet (css)]](https://cdn.slidesharecdn.com/ss_thumbnails/cascadingstylesheetcss-130819011155-phpapp02-thumbnail.jpg?width=600ounds&width=560&fit=bounds)
Similar to Css how to insert css
Css how to insert css
- 1. CSS-How to insertCSS By- Sumit Rana
- 2. Three Ways ToInsert CSS ⢠Inline Style ⢠Internal Style ⢠External Style
- 3. Inline Style ⢠InlineStyle is use for a Specific Element. ⢠It is used as a style attribute of a particular tag. ⢠The style attribute contains the CSS property. ⢠It is used only for one element.
- 4. Inline Style Example â˘<h1 style="color:blue;font-size:30px;">This is a heading</h1> ⢠<p style=âfont-size=20px;text-align=centerâ> This is a Paragraph</p>
- 5. Internal Style ⢠ItSpecify the CSS Style in the head section of the HTML document. ⢠It is used for multiple tags. ⢠<style> tag is used in the head section. ⢠<style> tag contains the style properties.
- 6. Internal Style Example â˘<head> <style> body { background-color: cyan; } h1 { color: red; font-size: 40px; } </style> </head>
- 7. External Style ⢠Itis used to put a CSS Style into number of HTML documents. ⢠It just links the CSS Style into the head section of HTML. ⢠Just one file can be used to design the entire style of the website. ⢠Each page should contain the <link> tag in the head section which gives reference to Style sheet to the page.
- 8. External Style Example â˘<head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head>
- 9. Difference Inline ⢠CSS Style-Inside tag ⢠Affects only one Tag Internal ⢠CSS Style- Reference head section ⢠Affects Multiple Pages External ⢠CSS Style- Inside head section ⢠Affects Multiple Tag
- 10. Difference Inline ⢠<h1 style="color:b lue;font- size:30px;">Thisis a heading</h1> Internal ⢠<head> <link rel="stylesheet" type ="text/css" href="mystyle. css"> </head> External ⢠<head> <style> h1 { color: red; font-size: 40px; } </style> </head>
- 11. Thank You ! BySumit Rana