سی ایس ایس میں ٹیکسٹ فارمیٹ کرنے کے لیے گائیڈ

ویب سائٹ کو ڈیزائن کرتے وقت، متن کی فارمیٹنگ ایک دلکش اور پڑھنے کے قابل انٹرفیس بنانے کا ایک اہم پہلو ہے۔

CSS کئی خصوصیات فراہم کرتا ہے جو آپ کو متن کے مختلف عناصر کو اپنی مرضی کے مطابق کرنے کی اجازت دیتا ہے، بشمول فونٹ کا رنگ، سائز، خاندان، سیدھ، وقفہ کاری، اور بہت کچھ۔

ذیل میں ہر ٹیکسٹ فارمیٹنگ پراپرٹی کے بارے میں تفصیلی گائیڈ ہے، ہر پراپرٹی کی مثالوں کے ساتھ۔

 

لکھائی کا رنگ

پیرامیٹر: ایک رنگ کی قدر، جو رنگ کا نام ہو سکتی ہے(مثال کے طور پر، red)، ہیکس کوڈ(مثال کے طور پر، "#FF0000")، RGB قدر(مثال کے طور پر، "rgb(255, 0, 0)") یا RGBA قدر(جیسے, "rgba(255, 0, 0, 0.5)")۔

p {  
  color: blue;  
}  

 

حرف کا سائز

پیرامیٹر: ایک سائز کی قدر، جو پکسلز میں ہو سکتی ہے(مثال کے طور پر، "16px")، em یونٹس(مثال کے طور پر، "1em")، ریم یونٹس(مثال کے طور پر، "1.2rem")، ویو پورٹ کی چوڑائی یونٹس(مثال کے طور پر، "10vw") ، ویو پورٹ اونچائی یونٹس(مثال کے طور پر، "5vh")، یا دیگر یونٹس۔

h1 {  
  font-size: 24px;  
}  

 

فونٹ فیملی

پیرامیٹر: ایک فونٹ فیملی لسٹ، ترجیحی ترتیب میں بیان کی گئی ہے۔ آپ فونٹ کا نام بتا سکتے ہیں(مثلاً، Arial) یا خصوصی حروف پر مشتمل فونٹ کے ناموں کو ڈبل اقتباسات(مثلاً، " Times New Roman) میں بند کر سکتے ہیں۔

body {  
  font-family: Arial, sans-serif;  
}  

 

فونٹ کا وزن اور انداز

پیرامیٹر font-weight: normal(default), bold, , bolder, lighter, یا عددی قدریں 100 سے 900 تک۔

پیرامیٹر font-style: normal(default), italic _

em {  
  font-style: italic;  
}  
  
strong {  
  font-weight: bold;  
}  

 

متن کی سجاوٹ

پیرامیٹر: "none"(default), "underline", "overline", "line-through"  یا خالی جگہوں سے الگ کردہ اقدار کا مجموعہ۔

a {  
  text-decoration: underline;  
}  
  
del {  
  text-decoration: line-through;  
}  

 

متن کی سیدھ

پیرامیٹر: "left"(default), "right", "center" or "justify".

p {  
  text-align: center;  
}  

 

لائن کی اونچائی اور حاشیہ

پیرامیٹر لائن کی اونچائی: ایک عددی قدر یا موجودہ فونٹ سائز کا فیصد۔

پیرامیٹر مارجن: پیمائش کی قدر، جیسے پکسلز(پی ایکس)، ایم یونٹس(ایم)، ریم یونٹس(ریم) وغیرہ۔

p {  
  line-height: 1.5;  
  margin-bottom: 10px;  
}  

 

ملٹی کالم ٹیکسٹ لے آؤٹ

پیرامیٹر: ایک مثبت عدد یا "auto"(default) ۔

.container {  
  column-count: 2;  
}  

 

ہور پر متن کے رنگ کی تبدیلی

کوئی مخصوص پیرامیٹر نہیں، صرف pseudo-class استعمال کریں :hover ۔

a:hover {  
  color: red;  
}  

 

ریاست پر متن کے رنگ کی تبدیلی(فعال، ملاحظہ کیا گیا)

کوئی مخصوص پیرامیٹر نہیں، صرف چھدم کلاسز استعمال کریں :active  اور :visited ۔

a:visited {  
  color: purple;  
}  

 

ہم امید کرتے ہیں کہ مندرجہ بالا وضاحتوں اور مثالوں سے آپ کو یہ سمجھنے میں مدد ملی ہے کہ CSS میں ٹیکسٹ فارمیٹنگ کی خصوصیات کو کس طرح استعمال اور اپنی مرضی کے مطابق بنانا ہے تاکہ آپ کی ویب سائٹ پر ایک بصری طور پر دلکش اور دلکش ٹیکسٹ انٹرفیس بنایا جائے۔