Text in CSS

8 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
One-time Fee
$49.99
List Price:  $69.99
You save:  $20
€48.02
List Price:  €67.23
You save:  €19.21
£39.14
List Price:  £54.79
You save:  £15.65
CA$71.63
List Price:  CA$100.29
You save:  CA$28.65
A$80.06
List Price:  A$112.09
You save:  A$32.03
S$67.51
List Price:  S$94.52
You save:  S$27.01
HK$388.46
List Price:  HK$543.88
You save:  HK$155.41
CHF 44.24
List Price:  CHF 61.94
You save:  CHF 17.70
NOK kr563.34
List Price:  NOK kr788.73
You save:  NOK kr225.38
DKK kr358.57
List Price:  DKK kr502.03
You save:  DKK kr143.46
NZ$88.43
List Price:  NZ$123.81
You save:  NZ$35.37
د.إ183.61
List Price:  د.إ257.07
You save:  د.إ73.45
৳5,964.32
List Price:  ৳8,350.53
You save:  ৳2,386.20
₹4,269.04
List Price:  ₹5,977
You save:  ₹1,707.95
RM224.30
List Price:  RM314.04
You save:  RM89.74
₦77,264.53
List Price:  ₦108,176.53
You save:  ₦30,911.99
₨13,894.99
List Price:  ₨19,454.09
You save:  ₨5,559.10
฿1,708.15
List Price:  ฿2,391.55
You save:  ฿683.40
₺1,759.41
List Price:  ₺2,463.31
You save:  ₺703.90
B$318.75
List Price:  B$446.27
You save:  B$127.52
R937.33
List Price:  R1,312.34
You save:  R375
Лв93.99
List Price:  Лв131.59
You save:  Лв37.60
₩72,848.40
List Price:  ₩101,993.60
You save:  ₩29,145.19
₪182.43
List Price:  ₪255.42
You save:  ₪72.98
₱2,932.41
List Price:  ₱4,105.61
You save:  ₱1,173.20
¥7,857.17
List Price:  ¥11,000.67
You save:  ¥3,143.49
MX$1,008
List Price:  MX$1,411.29
You save:  MX$403.28
QR181.52
List Price:  QR254.14
You save:  QR72.62
P693.18
List Price:  P970.50
You save:  P277.32
KSh6,450.70
List Price:  KSh9,031.50
You save:  KSh2,580.80
E£2,541.20
List Price:  E£3,557.88
You save:  E£1,016.68
ብር6,354.82
List Price:  ብር8,897.26
You save:  ብር2,542.43
Kz45,590.88
List Price:  Kz63,830.88
You save:  Kz18,240
CLP$49,454.60
List Price:  CLP$69,240.40
You save:  CLP$19,785.80
CN¥364.87
List Price:  CN¥510.85
You save:  CN¥145.98
RD$3,040.26
List Price:  RD$4,256.60
You save:  RD$1,216.34
DA6,753.71
List Price:  DA9,455.74
You save:  DA2,702.02
FJ$115.90
List Price:  FJ$162.28
You save:  FJ$46.37
Q384.44
List Price:  Q538.26
You save:  Q153.81
GY$10,442.13
List Price:  GY$14,619.81
You save:  GY$4,177.68
ISK kr6,976.10
List Price:  ISK kr9,767.10
You save:  ISK kr2,791
DH503.31
List Price:  DH704.68
You save:  DH201.36
L920.86
List Price:  L1,289.28
You save:  L368.41
ден2,954.07
List Price:  ден4,135.94
You save:  ден1,181.86
MOP$399.27
List Price:  MOP$559.01
You save:  MOP$159.74
N$928.04
List Price:  N$1,299.34
You save:  N$371.29
C$1,836.54
List Price:  C$2,571.30
You save:  C$734.76
रु6,797.51
List Price:  रु9,517.06
You save:  रु2,719.54
S/185.85
List Price:  S/260.20
You save:  S/74.35
K202.57
List Price:  K283.61
You save:  K81.04
SAR187.71
List Price:  SAR262.82
You save:  SAR75.10
ZK1,381.27
List Price:  ZK1,933.89
You save:  ZK552.61
L239.16
List Price:  L334.85
You save:  L95.68
Kč1,208.85
List Price:  Kč1,692.49
You save:  Kč483.63
Ft19,737.39
List Price:  Ft27,633.93
You save:  Ft7,896.53
SEK kr544
List Price:  SEK kr761.65
You save:  SEK kr217.64
ARS$51,344.11
List Price:  ARS$71,885.87
You save:  ARS$20,541.75
Bs344.88
List Price:  Bs482.86
You save:  Bs137.98
COP$220,596.26
List Price:  COP$308,852.42
You save:  COP$88,256.15
₡25,341.90
List Price:  ₡35,480.70
You save:  ₡10,138.79
L1,268.10
List Price:  L1,775.44
You save:  L507.34
₲389,249.85
List Price:  ₲544,980.94
You save:  ₲155,731.08
$U2,221.61
List Price:  $U3,110.44
You save:  $U888.82
zł204.67
List Price:  zł286.56
You save:  zł81.88
Already have an account? Log In

Transcript

Today we are going to discuss about the text. How can you add this styling here text? So first of all I need to comment, go to your page, refresh the page, I have one paragraph. So we are working on the text. I have to add another paragraph. I'm saying second, okay, I have to add the class in this class, I'm saying at a one on one, and I'm saying this is I have to call this here.

I'm saying One Ctrl V or two. Okay, what's going on, go to your page, refresh the page. As you know, you can use the color property. color red, go to your page, refresh the page. This is this is the first page. As you can see you have added the color property, you can add the color like this, or you can add the hexadecimal value.

How can you do that hash and value f f four times zero which is a hexadecimal value refresh the page. So now as you can see, it's adding the values or suppose if you are saying f, f, f, f, f f, refresh the page. Start working. So you have to memorize have the hexadecimal values, okay? modern ID is provided the hexadecimal values. Okay, so now you can also use the RGB a possible I'm saying okay we will discuss about it but but for now you have to add the red and haggle estimate values, right I mean, okay, I'm saying this is the right and I'm saying this is refresh the page.

So these are the two parameters. Okay. Now you can also add the alignment. I'm saying text, align, center, go to page refresh the page and as you can see you are align the test center. Here I'm saying text align, and I'm saying right, which your page refresh the page and as you can see, you are showing the text right. You can also use the Help and sorry, left right and center.

So, these are the alignments you can use or you can perform you can also use justify, or suppose if you have long texts which you page refresh the page now you can see it's currently showing like this. I'm saying text align, justify, justify, would you agree refresh the page. Now, as you can see, it's currently showing your text it will justify. Okay, so now you can also use the text text decoration property. So how can you do that? I'm adding the text decoration property and the value is overline.

Go to your page, refresh the page. Now you can see this a second I have to remove this fluid. Okay, I'm saying at this second paragraph, refresh the page. So now as you can see it's showing at the top of the paragraph align chicken sorry okay. So now if you are using the line go for suppose line refresh the page as you can see now you are showing the line, center of your paragraph line. So, okay, so now if you are saying under line, underline that means you're adding the line at the bottom of your paragraph.

So you can use your text decorations. You can also use your text, transform property. So how can you use your text from past one property? First of all, if you are using the uppercase, lowercase and capitalized, so how can you do that as you can see all letters in the we are using the small words. Now I'm saying x plus one transform and change capitalized. That means I'm saying this first letter is capital first letter is capital.

Okay, if I'm saying add the lowercase all I'm saying uppercase uppercase would you pay refresh the page? Sorry, it's double T. Refresh the page. Now as you can see all letters now all well in the uppercase, so it's totally depend upon you and your need. I'm saying You can also use the letter spacing for suppose I'm using the letter spacing to this paragraphs or suppose I'm saying letter spacing, letter spacing in most countries refresh the page. So now as you can see, I'm adding the letter spacing and pixel. If I'm saying to pixel, refresh the page, so I'm adding the two pixel letter you can also define the line height.

Okay, now, I'm saying line height, line height for school and things 0.7 color, such the face. Now as you can see, I'm just assigning the line height if I'm saying 10.7 refresh the page. Now as you can see, the height of the line is this. If I'm saying 1.7 the line height you are assigning 1.7 So you can also use the text direction and the text spacing for suppose if I'm saying the text is spacing, spacing, and I'm seeing pancakes, refresh the page, start working. Okay, I have used the text spacing at the top of my page or sorry. You can also use the text decoration.

So this is your text decoration. I'm sorry, not, that's the current text shadow. So you can add, I'm saying for example, and I'm saying to pixel red, go to your page, refresh the page. Now as you can see, you are adding, I'm saying blue or I'm saying black is where you can add them. Text shadow, or I'm seeing from the typical refresh the page so now as you can see, you are seeing that one pixel from the top and one pixel from the left first zero pixel, one pixel. Now as you can see, I'm saying left, zero pixels from the left side, one pixel from the right side and add some texture to the color is blob.

You can also use that column or any color as you want. Okay. So I think this is enough for the next session we are going to cover some other topics. So thank you for watching.

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.