The CSS Font
The CSS Font
Code :
Output :
The CSS font-size Property :
o Syntax :
font-size : 20px
Code:
Output :
font-variant property in CSS
font-variant: value
Values :
Output :
o Syntax :
letter-spacing: value;
Values :
normal : defines the standard character spacing. Normal value is the default
value for letter-spacing
length :establishes a length that is used as the character spacing (negative
values are also allowed).
initial : returns this property's default setting.
Inline style CSS : By using the inline CSS approach, CSS can be applied to a single
element. The "style" attribute of the relevant element defines inline styles.
Example :
<p style="color: yellow"> Changes the font color to yellow for this paragraph.</p>
Only the <p> element's font color will be altered by the code previously mentioned.
Pros :
1. Due to potential spam several email clients DO NOT permit the usage of
external.css referencing. Embedding could be beneficial in such cases.
2. Saves time by eliminating the need to go back and forth between the HTML file
and the CSS document for quick updates, prototyping, and easy tests.
3. As with the external style, you don't need to generate and upload a separate
document.
Cons :
1. Adding the code to the HTML file can make the page larger and take longer to
load.
2. Every HTML element must have a CSS rule added to it, which takes time and
complicates the HTML structure.
1. When you need one-time formatting for a particular tag, utilize inline style CSS.
2. You wish to alter the default CSS for a particular tag, which was specified
externally or at the top of the file.
Example :
<style> p{color:yellow} </style>
Advantages :
1. You don't need to upload several files because the code will only be added to the
one HTML file.
Disadvantages :
1. Since most webmail clients remove the head-tags, certain email clients do not
permit styles in the [head].
2. The size and loading time of the page may increase by adding the code to the
HTML content.
1. If the styles are only required for one file and you don't expect them ever
changing to apply to other pages, you can use internal style CSS to place your
css at the top of the file.
External CSS :To add CSS to several pages or all pages, utilize external CSS. In this
case, a css file contains all of the CSS code. It must have a.css extension, such as
style.css.
Example :
p{color:yellow}
This style.css file needs to be linked to your html pages in the following way:
The head section of HTML is where the link tag must be added.
Advantages :
1. Your HTML files will be smaller and have a better structure because the CSS
code is in a separate document.
2. The same.css file can be applied to many pages.
Disadvantages :
1. It's possible that until the external CSS is loaded, your pages won't render
correctly.
2. The download time of your website may rise if you upload or link to several CSS
files.
Values :
o Syntax :
text-transform: value;
Code :
Output :
text-align: value;
Code :
Output: