0% found this document useful (0 votes)
26 views

Css 3 Text Si Font

The document discusses different CSS properties for styling text, including: 1. Setting text color, background color, line height, letter spacing, text alignment, and text decoration. 2. Choosing fonts and font styles using properties like font-family, font-size, font-style, and font-weight. 3. Declaring multiple font properties together in one rule using the font shorthand property.

Uploaded by

p_isaic989
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
26 views

Css 3 Text Si Font

The document discusses different CSS properties for styling text, including: 1. Setting text color, background color, line height, letter spacing, text alignment, and text decoration. 2. Choosing fonts and font styles using properties like font-family, font-size, font-style, and font-weight. 3. Declaring multiple font properties together in one rule using the font shorthand property.

Uploaded by

p_isaic989
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
You are on page 1/ 2

Fisa css 3

Setarea proprietatilor textului 4. Distanta dintre liniile paragrafului


1. Setarea culorii textului
<html>
<html>
<head>
<head> <style type="text/css">
p.small {line-height: 90%}
<style type="text/css">
p.big {line-height: 200%}
h1 {color: #00ff00}
</style>
h2 {color: #dda0dd}
p {color: rgb(0,0,255)} </head>
</style> <body>
<p class="small">
</head>
This is a paragraph with a smaller line-height.
<body>
This is a paragraph with a smaller line-height.
<h1>This is header 1</h1>
This is a paragraph with a smaller line-height.
<h2>This is header 2</h2>
</p>
<p>This is a paragraph</p>
<p class="big">
</body>
This is a paragraph with a bigger line-height.
</html>
This is a paragraph with a bigger line-height.
This is a paragraph with a bigger line-height.
2.Setarea culorii de background pentru un text
</p>
(paragraph)
</body>
</html>
<html>
<head>
5.Alinierea textului
<style type="text/css"> <html>
span.highlight <head>
{
<style type="text/css">
background-color:yellow
h1 {text-align: center}
}
h2 {text-align: left}
</style>
h3 {text-align: right}
</head> </style>
</head>
<body>
<body>
<p>
<h1>This is header 1</h1>
<span class="highlight">This is a text.</span> This is
<h2>This is header 2</h2>
a text. This is a text. This is a text. This is a text. This
<h3>This is header 3</h3>
is a text. This is a text. This is a text. This is a text.
</body>
<span class="highlight">This is a text.</span>
</html>
</p>
</body>
6. Decorarea textului
</html>
<html>
<head>
3. Distanta dintre litere
<style type="text/css">
<html> h1 {text-decoration: overline}
<head> h2 {text-decoration: line-through}
h3 {text-decoration: underline}
<style type="text/css">
h4 {text-decoration: blink}
h1 {letter-spacing: -3px}
a {text-decoration: none}
h4 {letter-spacing: 0.5cm}
</style> </style>
</head>
</head>
<body>
<h1>This is header 1</h1>
<body>
<h2>This is header 2</h2>
<h1>This is header 1</h1>
<h3>This is header 3</h3>
<h4>This is header 4</h4>
<h4>This is header 4</h4>
</body>
<p><a href="http://www.w3schools.com/default.asp">
</html>
This is a link</a></p>
</body></html>

1
Fisa css 3
Fonturi </body></html>
1. Setarea fontului pentru text(font-family) 4.Grosimea fontului (font-weight:bold)
<html>
<head> <html>
<head>
<style type="text/css">
h3 {font-family: times} <style type="text/css">
p {font-family: courier} p.normal {font-weight: normal}
p.sansserif {font-family: sans-serif} p.thick {font-weight: bold}
</style> p.thicker {font-weight: 900}
</style>
</head>
</head>
<body>
<h3>This is header 3</h3> <body>
<p>This is a paragraph</p> <p class="normal">This is a paragraph</p>
<p class="sansserif">This is a paragraph</p> <p class="thick">This is a paragraph</p>
</body> <p class="thicker">This is a paragraph</p>
</html> </body>

2. Setarea dimensiunii font-ului(font-size) </html>

<html> 5. Font variant


<head> <html>
<head>
<style type="text/css">
h1 {font-size: 150%} <style type="text/css">
h2 {font-size: 130%} p.normal {font-variant: normal}
p {font-size: 100%} p.small {font-variant: small-caps}
</style> </style>
</head> </head>

<body> <body>
<h1>This is header 1</h1> <p class="normal">This is a paragraph</p>
<h2>This is header 2</h2> <p class="small">This is a paragraph</p>
<p>This is a paragraph</p> </body>
</body>
</html>
</html>

3. Setarea stilului (font-style:italic, bold , 6. Toate proprietatile fontului intr-o singura


normal) declaratie
<html>
<html> <head>
<head> <style type="text/css">
<style type="text/css"> p
h1 {font-style: italic} {
h2 {font-style: normal} font: italic small-caps 900 12px arial
p {font-style: oblique} }
</style> </style>
</head> </head>

<body> <body>
<h1>This is header 1</h1> <p>This is a paragraph</p>
<h2>This is header 2</h2> </body>
<p>This is a paragraph</p>
2

You might also like