CSS - Fonts
সিএসএস(CSS) টিউটোরিয়াল
এই অধ্যায়টি আপনাকে এইচটিএমএল উপাদানগুলিতে উপলব্ধ কোনও ফন্টের ফন্ট সেট করতে শেখায়। আপনি কোনও উপাদানের নিম্নলিখিত ফন্টের বৈশিষ্ট্যগুলি সেট করতে পারেন -
- ফন্টের পারিবারিক সম্পত্তি হরফের চেহারা পরিবর্তন করতে ব্যবহৃত হয়।
- হরফ শৈলীর বৈশিষ্ট্য একটি হরফ তির্যক বা তির্যক করতে ব্যবহৃত হয়।
- হরফ-বৈকল্পিক বৈশিষ্ট্যটি একটি ছোট ক্যাপস প্রভাব তৈরি করতে ব্যবহৃত হয়।
- হরফ বা হালকা কোনও ফন্ট প্রদর্শিত হয় বা হ্রাস করতে হরফ-ওজনের বৈশিষ্ট্য ব্যবহৃত হয়।
- হরফ আকারের বৈশিষ্ট্য হরফ বা হ্রাস করতে ব্যবহৃত হয়।
- হরফ হ্যান্ড হিসাবে হরফ হিসাবে ব্যবহৃত হ'ল অন্যান্য ফন্টের বৈশিষ্ট্য নির্দিষ্ট করে
ফন্ট পরিবার সেট করুন
নীচের উদাহরণটি দেওয়া হয়েছে, যা দেখায় যে কীভাবে কোনও উপাদানটির ফন্ট পরিবার সেট করতে হয়। সম্ভাব্য মান কোনও ফন্টের পরিবারের নাম হতে পারে।
উদাহরণ:
<html>
<head>
</head>
<body>
<p style = "font-family:georgia,garamond,serif;">
This text is rendered in either georgia, garamond, or the
default serif font depending on which font you have at your system.
</p>
</body>
</html>
ফন্ট স্টাইল সেট করুন
নীচের উদাহরণটি দেওয়া হয়েছে, যা দেখায় যে কীভাবে কোনও উপাদানটির ফন্ট শৈলী সেট করা যায়। সম্ভাব্য মানগুলি স্বাভাবিক, তির্যক এবং তির্যক।
উদাহরণ:
<html>
<head>
</head>
<body>
<p style = "font-style:italic;">
This text will be rendered in italic style
</p>
</body>
</html>
ফন্ট ভেরিয়েন্ট সেট করুন
নীচের উদাহরণটি দেখায় যে কীভাবে কোনও উপাদানটির ফন্টের বৈকল্পিক সেট করতে হয়। সম্ভাব্য মানগুলি হ'ল স্বাভাবিক এবং ছোট-ক্যাপ।
উদাহরণ:
<html>
<head>
</head>
<body>
<p style = "font-variant:small-caps;">
This text will be rendered as small caps
</p>
</body>
</html>
ফন্ট ওজন নির্ধারণ করুন
নীচের উদাহরণটি দেখায় যে কীভাবে কোনও উপাদানটির ফন্টের ওজন নির্ধারণ করতে হয়। ফন্ট-ওজন সম্পত্তি ফন্টটি কতটা সাহসী তা নির্দিষ্ট করতে কার্যকারিতা সরবরাহ করে। সম্ভাব্য মানগুলি স্বাভাবিক, সাহসী, সাহসী, হালকা, 100, 200, 300, 400, 500, 600, 700, 800, 900 হতে পারে।
উদাহরণ:
<html>
<head>
</head>
<body>
<p style = "font-weight:bold;">
This font is bold.
</p>
<p style = "font-weight:bolder;">
This font is bolder.
</p>
<p style = "font-weight:500;">
This font is 500 weight.
</p>
</body>
</html>
ফন্ট আকার নির্ধারণ করুন
নীচের উদাহরণটি দেখায় যে কীভাবে কোনও উপাদানটির ফন্টের আকার সেট করতে হয়। হরফ আকারের বৈশিষ্ট্য হরফের আকার নিয়ন্ত্রণ করতে ব্যবহৃত হয়। সম্ভাব্য মানগুলি xx- ছোট, x- ছোট, ছোট, মাঝারি, বৃহত্তর, x- বড়, xx- বড়, ছোট, বৃহত্তর, পিক্সেল বা% এ আকার হতে পারে।
উদাহরণ:
<html>
<head>
</head>
<body>
<p style = "font-size:20px;">
This font size is 20 pixels
</p>
<p style = "font-size:small;">
This font size is small
</p>
<p style = "font-size:large;">
This font size is large
</p>
</body>
</html>
ফন্ট আকার সমন্বয় সেট করুন
নীচের উদাহরণটি দেখায় যে কীভাবে কোনও উপাদানটির ফন্টের আকার সমন্বয় করা যায়। এই বৈশিষ্ট্যটি আপনাকে ফন্টকে আরও সুসংগঠিত করতে এক্স-উচ্চতা সামঞ্জস্য করতে সক্ষম করে। সম্ভাব্য মান যে কোনও সংখ্যা হতে পারে।
উদাহরণ:
<html>
<head>
</head>
<body>
<p style = "font-size-adjust:0.61;">
This text is using a font-size-adjust value.
</p>
</body>
</html>
ফন্ট আকার সমন্বয় সেট করুন
নীচের উদাহরণটি দেখায় যে কীভাবে কোনও উপাদানটির ফন্টের আকার সমন্বয় করা যায়। এই বৈশিষ্ট্যটি আপনাকে ফন্টকে আরও সুসংগঠিত করতে এক্স-উচ্চতা সামঞ্জস্য করতে সক্ষম করে। সম্ভাব্য মান যে কোনও সংখ্যা হতে পারে theফন্ট স্ট্রেচ সেট করুন
নীচের উদাহরণটি দেখায় যে কীভাবে কোনও উপাদানটির ফন্ট প্রসারিত করা যায়। এই বৈশিষ্ট্যটি ব্যবহার করা হরফের প্রসারিত বা ঘনীভূত সংস্করণটি ব্যবহারকারীর কম্পিউটারের উপর নির্ভর করে।
সম্ভাব্য মানগুলি স্বাভাবিক, প্রশস্ত, সংকীর্ণ, অতি-ঘনীভূত, অতিরিক্ত-ঘনীভূত, ঘনীভূত, আধা-ঘনীভূত, আধা-প্রসারিত, প্রসারিত, অতিরিক্ত-প্রসারিত, অতি-প্রসারিত হতে পারে।
উদাহরণ:
<html>
<head>
</head>
<body>
<p style = "font-stretch:ultra-expanded;">
If this doesn't appear to work, it is likely that your computer
doesn't have a <br>condensed or expanded version of the font being used.
</p>
</body>
</html>
শর্টহ্যান্ড সম্পত্তি
আপনি একবারে সমস্ত ফন্ট বৈশিষ্ট্য সেট করতে ফন্ট সম্পত্তি ব্যবহার করতে পারেন।
উদাহরণস্বরূপ
<html>
<head>
</head>
<body>
<p style = "font:italic small-caps bold 15px georgia;">
Applying all the properties on the text at once.
</p>
</body>
</html>