CSS ফন্ট বৈশিষ্ট্যগুলি আমাদের পাঠ্যের চেহারা পরিবর্তন করতে দেয়। নিম্নলিখিত বৈশিষ্ট্যগুলি আমাদের পাঠ্য শৈলীতে সহায়তা করে৷
ফন্ট-পরিবার
এই বৈশিষ্ট্যটি একটি উপাদানের জন্য ফন্ট ফেস সেট করতে ব্যবহৃত হয়।
ফন্ট-কারিং
ক্যারেক্টার স্পেসিং ইউনিফর্ম করতে এবং পঠনযোগ্যতা বাড়াতে, ফন্ট-কার্নিং বৈশিষ্ট্য ব্যবহার করা হয়। যাইহোক, এই সম্পত্তি ফন্ট নির্দিষ্ট.
ফন্ট-সাইজ
ফন্ট-আকারের বৈশিষ্ট্য ফন্টের আকার নির্ধারণ করে।
ফন্ট-স্ট্রেচ
কিছু ফন্টের অতিরিক্ত মুখ থাকে যেমন ঘনীভূত, গাঢ় ইত্যাদি। এগুলি নির্দিষ্ট করতে ফন্ট-স্ট্রেচ প্রপার্টি ব্যবহার করা হয়।
ফন্ট-স্টাইল
একটি কোণ দ্বারা টেক্সট তির্যক করতে, ফন্ট-স্টাইল বৈশিষ্ট্য ব্যবহার করা হয়।
ফন্ট-ভেরিয়েন্ট
ফন্ট-ভেরিয়েন্ট আমাদের নির্দিষ্ট করতে দেয় যে একটি উপাদান ছোট ক্যাপগুলিতে প্রদর্শিত হবে কি না।
ফন্ট-ওজন
অক্ষরের সাহসিকতা ফন্ট-ওয়েট বৈশিষ্ট্য দ্বারা নির্দিষ্ট করা হয়।
আমরা ফন্টের বৈশিষ্ট্যও ব্যবহার করতে পারি যা উপরের সমস্ত বৈশিষ্ট্যের জন্য একটি সংক্ষিপ্ত বিবরণ।
সিনট্যাক্স
ফন্ট সম্পত্তির সিনট্যাক্স নিম্নরূপ -
Selector {
font: /*value*/
} নিচের উদাহরণগুলো CSS ফন্ট প্রপার্টি −
চিত্রিত করেউদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
div {
margin: 3px;
float: left;
font-family: "Matura MT Script Capitals";
font-size: 200%;
}
#a {
font-style: normal;
}
#b {
font-style: italic;
}
#c {
font-style: oblique 40deg;
font-family: "Harlow Solid Italic";
}
</style>
</head>
<body>
<div id="a">Normal Demo</div>
<div id="b">Italic Demo</div>
<div id="c">Oblique Demo</div>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
* {
font-size: 1.1em;
list-style: circle;
}
li:first-child {
background-color: seashell;
font-family: cursive;
}
li:nth-child(2) {
background-color: azure;
font-family: "Brush Script Std", serif;
}
li:last-child {
background-color: springgreen;
font-family: "Gigi", Arial;
}
</style>
</head>
<body>
<h2>Learning Scala</h2>
<ul>
<li>Scala is a pure object-oriented language in the sense that every value is an object.</li>
<li>Scala is compiled into Java Byte Code which is executed by the Java Virtual Machine (JVM).</li>
<li>Scala provides a lightweight syntax for defining anonymous functions</li>
</ul>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
