Mefth Loader Gif
Last Updated: 21-Nov-2021


CSS Word Spacing & break


HTML SOURCE CODE


<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
	<title>CSS course</title>
	<link rel="stylesheet" type="text/css" href="style.css">
<link href="https://fonts.googleapis.com/css2?family=Quicksand&display=swap" rel="stylesheet">
</head>
<body>

	<!-- ናይ ሎሚ ትምህርትና ብዛዕባ  Word Spacing ን Word break ን ኢዩ።-->
<p class="paragraph-st">This is CSS course for Begginers, Here we are in 13rd part of the course, Numbers are 1 2 3 4 5 6 7 8 9 10 11 12 13</p>

<p class="paragraph-nd">This is CSS course for Begginers, Here we are in 13rd part of the course, Numbers are 1 2 3 4 5 6 7 8 9 10 11 12 13</p>

<p class="paragraph-rd">This is CSS course for Begginers, Here we are in 13rd part of the course, Numbers are 1 2 3 4 5 6 7 8 9 10 11 12 13</p>

<p class="paragraph-th">This is CSS course for Begginers.</p>

</body>
</html>

CSS Word Spacing


.paragraph-st,.paragraph-nd,.paragraph-rd,.paragraph-th{
    font-size: 16px; /* ዓቐን ዕብየት ጽሕፈት */
    font-style: normal; /* ቅዲ ጽሕፈት */
	background-color: hsl(160, 80%, 50%); /* Background Color */
	font-family: 'Arial', sans-serif; 
}
	/*
	
	ካብዚኦም ድላይካ መሪጽካ ክትጥቀም ትኽእል ኢኻ፡         
	
word spacing
------------------------------------
word-spacing: normal  | length | intial | inherit;
	*/
	
}
.paragraph-st{
word-spacing: normal;
}

.paragraph-nd{
word-spacing: 20px;
 
}
.paragraph-rd{
word-spacing: inherit;
}

.paragraph-th{
word-spacing: inherit;
}
	

The Result of the above Code is:

CSS Word Spacing & break

CSS Word Break


.paragraph-st,.paragraph-nd,.paragraph-rd,.paragraph-th{
    font-size: 16px; /* ዓቐን ዕብየት ጽሕፈት */
    font-style: normal; /* ቅዲ ጽሕፈት */
	background-color: hsl(160, 80%, 50%); /* Background Color */
	font-family: 'Arial', sans-serif; 
}
	/*
	
	ካብዚኦም ድላይካ መሪጽካ ክትጥቀም ትኽእል ኢኻ፡         
	
word break
------------------------------------
word-break: break-all  | normal | keep-all | break-word | initial | inherit;
	*/
	
}
.paragraph-st{
word-break: break-all;
}

.paragraph-nd{
word-break: normal;
 
}
.paragraph-rd{
	word-break: keep-all;
}

.paragraph-th{
word-break: break-word;
}

The Result of the above Code is:

CSS Word Spacing & break

In Tigrinya Language (ብትግርኛ)



URL Copied
Share this              

Report for Comment or Reply




Mefth Loader gif

Login to Write... comment.

You must Login to write Comment.

We've Recommended Articles for you