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
€46.70
List Price:  €65.39
You save:  €18.68
£39.94
List Price:  £55.92
You save:  £15.98
CA$68.57
List Price:  CA$96.01
You save:  CA$27.43
A$76.53
List Price:  A$107.15
You save:  A$30.62
S$67.94
List Price:  S$95.13
You save:  S$27.18
HK$390.79
List Price:  HK$547.14
You save:  HK$156.34
CHF 45.61
List Price:  CHF 63.86
You save:  CHF 18.24
NOK kr553.82
List Price:  NOK kr775.40
You save:  NOK kr221.57
DKK kr348.39
List Price:  DKK kr487.78
You save:  DKK kr139.38
NZ$84.29
List Price:  NZ$118.01
You save:  NZ$33.72
د.إ183.60
List Price:  د.إ257.06
You save:  د.إ73.45
৳5,485.75
List Price:  ৳7,680.49
You save:  ৳2,194.74
₹4,172.64
List Price:  ₹5,842.03
You save:  ₹1,669.38
RM237.74
List Price:  RM332.86
You save:  RM95.11
₦61,737.65
List Price:  ₦86,437.65
You save:  ₦24,700
₨13,922.03
List Price:  ₨19,491.96
You save:  ₨5,569.92
฿1,847.10
List Price:  ฿2,586.09
You save:  ฿738.99
₺1,618.04
List Price:  ₺2,265.39
You save:  ₺647.34
B$259.65
List Price:  B$363.53
You save:  B$103.88
R930.41
List Price:  R1,302.64
You save:  R372.23
Лв91.35
List Price:  Лв127.90
You save:  Лв36.55
₩68,760.70
List Price:  ₩96,270.48
You save:  ₩27,509.78
₪187.33
List Price:  ₪262.29
You save:  ₪74.95
₱2,881.22
List Price:  ₱4,033.94
You save:  ₱1,152.71
¥7,761.78
List Price:  ¥10,867.12
You save:  ¥3,105.33
MX$847.89
List Price:  MX$1,187.12
You save:  MX$339.22
QR182.08
List Price:  QR254.93
You save:  QR72.84
P710.02
List Price:  P994.08
You save:  P284.06
KSh6,685.83
List Price:  KSh9,360.69
You save:  KSh2,674.86
E£2,398.89
List Price:  E£3,358.63
You save:  E£959.74
ብር2,859.67
List Price:  ብር4,003.77
You save:  ብር1,144.10
Kz41,816.63
List Price:  Kz58,546.63
You save:  Kz16,730
CLP$48,009.39
List Price:  CLP$67,216.99
You save:  CLP$19,207.60
CN¥361.91
List Price:  CN¥506.70
You save:  CN¥144.79
RD$2,909.49
List Price:  RD$4,073.53
You save:  RD$1,164.03
DA6,727
List Price:  DA9,418.34
You save:  DA2,691.34
FJ$113.07
List Price:  FJ$158.31
You save:  FJ$45.24
Q388.52
List Price:  Q543.96
You save:  Q155.44
GY$10,463.89
List Price:  GY$14,650.29
You save:  GY$4,186.39
ISK kr7,010.59
List Price:  ISK kr9,815.39
You save:  ISK kr2,804.80
DH505.48
List Price:  DH707.71
You save:  DH202.23
L884.07
List Price:  L1,237.78
You save:  L353.70
ден2,875.01
List Price:  ден4,025.24
You save:  ден1,150.23
MOP$402.80
List Price:  MOP$563.96
You save:  MOP$161.15
N$931.61
List Price:  N$1,304.33
You save:  N$372.72
C$1,835.88
List Price:  C$2,570.38
You save:  C$734.50
रु6,711.95
List Price:  रु9,397.27
You save:  रु2,685.31
S/188.15
List Price:  S/263.43
You save:  S/75.27
K192.92
List Price:  K270.11
You save:  K77.18
SAR187.48
List Price:  SAR262.49
You save:  SAR75.01
ZK1,338.41
List Price:  ZK1,873.89
You save:  ZK535.47
L232.39
List Price:  L325.37
You save:  L92.97
Kč1,173.84
List Price:  Kč1,643.47
You save:  Kč469.63
Ft18,183.27
List Price:  Ft25,458.03
You save:  Ft7,274.76
SEK kr546.32
List Price:  SEK kr764.90
You save:  SEK kr218.57
ARS$43,802.69
List Price:  ARS$61,327.27
You save:  ARS$17,524.58
Bs345.39
List Price:  Bs483.57
You save:  Bs138.18
COP$195,145.11
List Price:  COP$273,218.78
You save:  COP$78,073.66
₡25,506.16
List Price:  ₡35,710.66
You save:  ₡10,204.50
L1,238.25
List Price:  L1,733.65
You save:  L495.39
₲374,580.54
List Price:  ₲524,442.73
You save:  ₲149,862.19
$U1,916.38
List Price:  $U2,683.09
You save:  $U766.70
zł202.30
List Price:  zł283.24
You save:  zł80.93
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.