Go to Previous Section:
Readable CSSএটি হচ্ছে CSS Getting Started এর ৭ম টীউটোরিয়াল, এখানে টক্সট স্টাইল এর অনেক উদাহরণ দেয়া আছে। একাহে বর্ণনা করা হয়েছে কিভাবে আপনি আপনার নমুনা stylesheet এ বিভিন্ন ফন্ট ব্যাবহার করবেন।
তথ্য: টেক্সট স্টাইল
সিএসএস স্টাইলিং লেখার জন্য বিভিন্ন ধরণ আছে।
এখানে fontআপনি আপনার লেখার বিভিন্ন দিক উল্লেখ করতে পারবেন,—যেমন:
- বোল্ড, ইটালিক, এবং ছোট হাতের অক্ষর ( ছোট হাতের অক্ষর)
- আকার
- লাইন উচ্চতা
- ফন্টের বিভিন্ন ধরণ
উদাহরণ
p {font: italic 75%/125% "Comic Sans MS", cursive;}
এই নিয়মে বিভিন্ন ফন্টের ধরণ দেয়া আছে, প্রতিটি অনুচ্ছেদ এর লেখা হবে ইতালিক ফরমে।
প্রতিটি অনুচ্ছেদ এর মূল উপাদান আকার ফন্ট সাইজ তিন চতুর্থাংশ সেট করা হয়েছে, লাইন উচ্চতা ১২৫% সেট করা হয়েছে। (স্বাভাবিক তুলনায় একটু বেশি ব্যবধানযুক্ত)।
Comic Sans MS এ,কিছু ফন্ট আকার সেট করা থাকে কিন্তু যদি তা গ্রহণ যোগ্য না হয় তবে ব্রাউজার ডিফল্ট কারসিভ (hand-written) আকার ব্যাবহার করতে পারবে।
এই নিয়মে বোল্ড এবং ছোট হাতের অক্ষরের পার্শ্ব প্রতিক্রিয়া আছে:(setting them to normal):
ফন্টের আকার
আপনি ভবিষৎ বানী করতে পারবেনা আপনার ডকুমেন্টি কোন ধরনের পাঠক পাবে। সুতরাং আপনি একটি উল্লেখযোগ্য ফন্টের আকার দিতে পারেন, সব থেকে ভাল হয় যদি আপনি পছন্দ অনুযায়ী একটি ফন্টের তালিকা দেন।
একটি ডিফল্ট আকার দিয়ে লিস্টটি শেষ করুনঃ serif, sans-serif, cursive, fantasy or monospace.
ডকুমেন্ট এ যদি কিছু ফন্ট আকার সমর্থন না করে তবে ব্রাউজার এ আপনি ফন্ট আকার প্রতিস্থাপন করতে পারেন। ডকুমেন্ট এ সমর্থন করে না এমন বিশেষ অক্ষর থাকতে পারে। যদি ব্রাউজার ঐই অক্ষরের কোন ফন্ট আকার খুজে পায় তবে আপনি সেটি ব্যাবহার করতে পারেন।
তার নিজস্ব ফন্ট আকার উল্লেখ করার font-familyএটি ব্যাবহার করুণ।
ফন্টের মাপ
ব্রাউজার ব্যাবহারকারি পৃষ্ঠাটি পড়ার সময় ডিফল্ট ফন্টরে মার অথবা লেখার আকার পরিবর্তন করতে পারেন,তাই সবথেকে ভাল যদি আপনি একটি আপেক্ষিক মাপ ব্যাবহার করতে পারেন।
আপনি ফন্টের ভাল মাপের জন্য কিছু বিল্ট ইন মান ব্যবহার করতে পারেন,যেম্ন-বড়,ছোট এবং মাঝারি। আপনি চাইলে ওই মান গুলো ব্যবহার করতে পারেন যেগুলো মূল উপাদানের ফন্টের আকারের সাথে সম্পর্কিত, যেমন ছোট বড় , ১৫০% অথবা ১.৫ em।একটি "em" হচ্ছে "m" অক্ষরের সমান প্রস্থের(মূল উপাদানের ফন্টের আকারের জন্য); এইভাবে ১.৫em হচ্ছে মূল উপাদানের এক এবং অর্ধ আকার।
প্রয়োজনে আপনি একটি নিদ্রিষ্ট আকার , যেমন: 14px (14 pixels) ডিসপ্লে ডিভাইস এর জন্য অথবা 14pt (14 points) প্রিন্টারের জন্য নির্ধারণ করতে পারেন। এটা তাদের পরিবর্তন করার অনুমতি দেয় না, কারণ এইটা impaired ব্যাবহারকারিদের জন্য অ্যাক্সেসযোগ্য হয় না। আরো ভাল কৌশল ডকুমেন্টের উপরের স্তরের এবং মাঝারিতে একটি বিল্ট-ইন মান সেট করা হয়,এবং তারপর তার সমস্ত descendent উপাদানের জন্য আপেক্ষিক মাপ সেট করা হয়।
তার নিজস্ব একটি ফন্ট সাইজ উল্লেখ করার জন্য font-sizeব্যাবহার করুন।
লাইনের উচ্চতা
লাইনের উচ্চতা ২টা লাইনের মধ্যকার স্পেস উল্লেখ করে। আপনার ডকুমেন্টে দীর্ঘ লাইনের অনুচ্ছেদ থাক্লে,বিশেষ করে ফন্টের রাকার যদি ছোট হয় তবে পড়ার সুবিধারতে স্বাভাবিকের থেকে একটু বড় স্পেস দিন।
তার নিজস্ব একটি লাইন উচ্চতা উল্লেখ করার জন্যline-height ব্যাবহার করুণ।
সজ্জা
text-decoration ব্যাবহার করে আপনি আন্দার-লাইন অথবা অনন্য ডেকোরেশন করতে পারেন। আপনি স্পষ্টভাবে ডেকোরেশন অপসরণ করতেও এটি ব্যাবহার করতে পারেন।
অন্যান্য বৈশিষ্ট্য
Italic জন্য ব্যাবহার করুন font-style: italic;
Bold জন্য ব্যাবহার করুন font-weight: bold;
Small capitals জন্য ব্যাবহার করুন font-variant: small-caps;
পৃথকভাবে এই গুলো বন্ধ করার জন্য, আপনি স্বাভাবিক মান সুনির্দিষ্টভাবে উল্লেখ করুন।
আপনি অন্য কোন উপায়েও বিভিন্ন টেক্সট স্টাইল নির্দিষ্ট করতে পারেন।
উদাহরণস্বরূপ, এখানে উল্লিখিত অন্য কিছু মান আছে যা আপনি ব্যবহার করতে পারেন।
একটি জটিল স্টাইলশীট,shorthand font property এড়িয়ে চলে কারণ তার কিছু পার্শ্ব প্রতিক্রিয়া আছে (resetting other individual properties)।
আরো তথ্যের জন্য Fonts in the CSS Specification দেখতে পারেন। টেক্সট ডেকোরেশন এর আরো তথ্যের জন্য দেখুন Text।
আপনি ব্যবহারকারীদের সিস্টেমে ইনস্টল আকারেরউপর নির্ভর করতে না ছাইলে, আপনি ব্যবহার করতে পারেন@font-faceএটি একটি অনলাইন ফন্ট উল্লেখ করে। যদিও এই নিয়ম সমর্থন করে ব্যাবহারকারিদের এমন একটি ব্রাউজার থাকা প্রয়োজন।
কর্ম: উল্লেখ ফন্ট
একটি সহজ ডকুমেন্ট এর জন্য <body> তে আপনি ফন্ট এবং ডকুমেন্ট এর বাকি সেটিংস সেট করতে পারেন।
- আপনার সিএসএস ফাইল সম্পাদনা করুন.
- ডকুমেন্ট জুড়ে ফন্ট পরিবর্তন করতে নিম্নলিখিত নিয়ম যোগ করুন. সিএসএস ফাইল উপরে এটি একটি লজিক্যাল জায়গা, কিন্তু আপনি যখন এখানে রাখবেন সেখানেও তার একই প্রভাব পরবে:
body {font: 16px "Comic Sans MS", cursive;} - একটি মন্তব্য যোগ করুন যেটি নিয়ম ব্যাখ্যা করে এবং একটি স্পেস দিন যাতে করে আপনার পছন্দের বিন্যাসের সাথে এটি মিলে যায়।
- ফাইল সংরক্ষণ করুন এবং ফলাফল দেখতে আপনার ব্রাউজার রিফ্রেশ করুন। যদি আপনার Comic Sans MS এ থাকা আকার অথবা হাতে লেখা itlic আকার সমর্থন না করে ,তবে আপনার ব্রাউজার অন্নক্স কোন আকার পছন্দ করতে পারেঃ
Cascading Style Sheets Cascading Style Sheets - ব্রাউজার মেনুবার, View > Text Size > Increase (or View > Zoom > Zoom In) পছন্দ করতে পারে। আপনি স্টাইল টি 16 পিক্সেল উল্লেখ যদিও, ডকুমেন্ট পড়া একটি ব্যবহারকারী মাপ পরিবর্তন করতে পারেন।
Without changing anything else, make all six initial letters twice the size in the browser's default serif font:
| Cascading Style Sheets |
| Cascading Style Sheets |
Add the following style declaration to the strong rule:
font: 200% serif;If you use separate declarations for
font-size and font-family, then the font-style setting on the first paragraph is not overridden.
Hide solution
পরবর্তী ?
Go to Next Section:
Colorআপনার নমুনা ডকুমেন্ট ইতিমধ্যে বিভিন্ন নামে রং ব্যবহার করতে সক্ষম. The next section দেয়া আছে রং এর তালিকা এবং কিভাবে আপনি রং প্রয়োগ করবেন।