CSS stands for Cascading Style Sheets. CSS describe how HTML elements are to be displayed on screen, paper, or in other media.
With CSS , we can control the color, font, the size of text, the spacing between elements, how elements are positioned and laid out, what background images or background colors to be used, different displays for different devices and screen sizes, and much more!
CSS can be added to HTML documents in 3 ways:
- Inline - by using the style attribute inside HTML elements.
- Internal - by using a <style> element in the <head> section.
- External - by using a <link> element to link an external CSS file.
❗Here we are discussing Standard CSS used in HTML. The major part of CSS will be discussed later in CSS Blog.
Inline CSS
An inline CSS is used to apply a unique style to a single HTML element. An inline CSS uses the style attribute of an HTML element.
Background Color
We can set the background color for HTML elements like in Text , images , heading, block , section etc..
Example:
- <h1 style="background-color:yellow;">Background Color used in a heading tag</h1>
- <p style="background-color:orange;">This is a paragraph with orange background color.</p>
- <div>hello ,how are you!!!<div style="background-color: rgba(238,93,72,0.8);">This is a div with background color.</div></div>
Text Color
We can set the color of text in HTML.
Example:
- <h3 style="color:blue">This is an example of Text Color in heading tag.</h3>
- <p style="color:grey">This is an example of Text Color in paragraph tag. </p>
Border Color
We can set the color of borders in HTML.
❗Border values and styles we will learn in CSS Blog with more Examples.
Example:
- <h2 style="border: 2px solid green">Hello Friends</h2>
- <h2 style="border: 2px dashed tomato">Hello Friends</h2>
- <h2 style="border: 1px dotted orange">Hello Friends</h2>
❗Internal CSS and External CSS are discussed in next blog.
=======================================================================
📌Here is Codepen link of above examples :- 🔗https://codepen.io/arwazkhan189/pen/BaKovqm?editors=1000
Next we will learn about Internal CSS and External CSS ...
Keep Learning and practice , practice and practice.. !!!
LIKE , COMMENT , SHARE , SUBSCRIBE the Blog!
No comments:
Post a Comment