কীভাবে পুরো এইচটিএমএল ডকুমেন্টে গ্লোবাল ফন্ট প্রয়োগ করা যায়


175

আমার একটি HTML পৃষ্ঠা রয়েছে যার মধ্যে কিছু পাঠ্য এবং ফর্ম্যাট রয়েছে। আমি এটি একই ফন্ট-পরিবার এবং পাঠ্যের সমস্ত অভ্যন্তরীণ বিন্যাসকে উপেক্ষা করে একই পাঠ্য আকার করতে চাই want

আমি HTML পৃষ্ঠার জন্য একটি গ্লোবাল ফন্ট ফর্ম্যাট সেট করতে চাই।

আমি কীভাবে এটি অর্জন করতে পারি?

উত্তর:


263

আপনারা !importantসিএসএসের মধ্যে তারকাচিহ্ন এবং উপাদানগুলি ব্যবহার করতে সক্ষম হবেন ।

html *
{
   font-size: 1em !important;
   color: #000 !important;
   font-family: Arial !important;
}

তারকাচিহ্নটির সাথে সমস্ত কিছু মেলে (আপনি সম্ভবত এটি ছাড়াও htmlপালাতে পারেন)।

!importantনিশ্চিত করে যে কিছুই পাল্টাতে পারেন আপনি এই স্টাইলে সেট করেছি (যদি না তা গুরুত্বপূর্ণ)। (এটি আপনার প্রয়োজনীয়তার সাথে সহায়তা করার জন্য এটি "পাঠ্যের অভ্যন্তরীণ বিন্যাসকে উপেক্ষা করা উচিত" - যা আমি বোঝাতে চেয়েছিলাম যে অন্যান্য স্টাইলগুলি এগুলি ওভাররাইট করতে পারে না)

ধনুর্বন্ধনীগুলির মধ্যে থাকা স্টাইলের বাকী অংশগুলি অন্য স্টাইলিংয়ের মতো এবং আপনি সেখানে যা চান তা করতে পারেন। আমি উদাহরণ হিসাবে হরফ আকার, রঙ এবং পরিবার পরিবর্তন করতে বেছে নিয়েছি।


24
+1 !importantদরকারী, তবে এটি অতিরিক্ত ব্যবহার হয়ে গেলে কিছুটা "থার বি দানব" পেতে পারে।
স্টুপারউসার

2
এর দুর্দান্ত ব্যবহারের জন্য +1 !important। এটি সর্বদা সর্বশেষ বিকল্প হিসাবে ব্যবহার করা উচিত।
dShringi

3
নোট করুন !importantএখানে ব্যবহারের মূল পোস্টারের প্রয়োজনীয়তার কারণে এটি হয়, "একই ফন্ট-পরিবার এবং একই পাঠ্য-আকারের পাঠ্যের সমস্ত অভ্যন্তরীণ বিন্যাস উপেক্ষা করে রাখুন।" আপনার যদি সেই প্রয়োজনীয়তা না থাকে তবে আপনি ব্যবহার করতে চান না !important
শেঠ

1
ব্যবহারের html * {}বা body * {}আপনি আরো নির্দিষ্ট মাধ্যমে ওভাররাইড এড়াতে সাহায্য করবে body p {}অন্তর্ভুক্ত স্টাইল শীট হবে। body p {}এর চেয়ে বেশি নির্দিষ্ট body {}, সুতরাং নক্ষত্রটি এখানে একটি গুরুত্বপূর্ণ উপাদান।
YoYo

1
আমার মনে হয় আপনি বাদ পারেন htmlথেকে html *এখানে
JonnyRaa

44

আমি মনে করি সেরা অনুশীলন হ'ল ফন্টটি শরীরে সেট করা:

body {
    font: normal 10px Verdana, Arial, sans-serif;
}

এবং যদি আপনি এটি কোনও উপাদানটির জন্য পরিবর্তন করার সিদ্ধান্ত নেন তবে এটি সহজেই ওভাররাইট করা যেতে পারে:

h2, h3 {
    font-size: 14px;
}

আপনি যদি ফাউন্ডেশন সিএসএসের মতো কাঠামো ব্যবহার করেন তবে এটি যুক্ত না করে কার্যকর হয় না!
পেট্রোস কিরিয়াকু

16

এটি আপনার সিএসএসের বডি সিলেক্টারে সেট করুন। যেমন

body {
    font: 16px Arial, sans-serif;
}

1
এটি আরও নির্দিষ্ট নির্বাচকদের সাথে ওভাররাইড করা যেতে পারে।
স্টুপারউসার

2
এটি সমস্ত উপাদানের ক্ষেত্রে প্রযোজ্য হবে না, উদাহরণস্বরূপ: ইনপুট টাইপ = 'বোতাম'
আরআরটিডব্লু

12

নিম্নলিখিত সিএসএস ব্যবহার করুন:

* {
    font: Verdana, Arial, 'sans-serif' !important;/* <-- fonts */
}

*-Selector মানে কোন / সব উপাদান, কিন্তু স্পষ্টত খাদ্য শৃঙ্খলে নীচে হতে হবে যখন এটি আরো অগ্রাহ্য আসে নির্দিষ্ট নির্বাচকরা।

নোট করুন যে !important-ফ্ল্যাগটি নিখুঁত হওয়ার fontজন্য স্টাইলটি রেন্ডার করবে *, এমনকি অন্য নির্বাচকরা পাঠ্যটি সেট করতে ব্যবহার করা হয়েছে (উদাহরণস্বরূপ, bodyবা সম্ভবত একটি p)।


1
হয়ত !importantঅন্যান্য নির্বাচকদের সেটিংসকে ওভাররাইড করা থেকে বিরত রাখতে পারে ।
কোয়াসডঙ্ক

1
হ্যাঁ, !importantঅন্য নির্বাচকদের যতক্ষণ না তারা এটি ব্যবহার না করে ততক্ষণ ওভাররাইড করা থেকে বিরত রাখতে পারে। হেহ। আমি আমার পোস্টটি সম্পাদনা করব এবং এটি যুক্ত করব - ধন্যবাদ। :-)
কার্লিন্ডমার্ক

হ্যাঁ, এটা ঠিক। পুরোপুরি নিশ্চিত নয়, তবে আমি মনে করি আপনি কোথায় ঘোষণাপত্রটি রাখেন তার উপরও পছন্দটি নির্ভর করে। যদি আপনি এটি একেবারে নীচে রাখেন তবে আমি !importantউপরের আরও নির্দিষ্ট নির্বাচকদের থেকে ওভাররাইডও করতে পারি । তবে এটি এখানে আমার অনুমানের ঠিক মত নয় :)
কোয়াজডাঙ্ক

এটি হ'ল একমাত্র উত্তর যা আসলে আমার পক্ষে কাজ করেছিল। নিশ্চিত না কেন, তবে এটি হয়েছিল।
পিটার গর্ডন

5

আপনার কখনই ব্যবহার করা উচিত নয় * + !important। আপনি যদি এইচটিএমএল ডকুমেন্টের কিছু অংশে ফন্ট পরিবর্তন করতে চান? আপনার সর্বদা গুরুত্বপূর্ণ ছাড়া শরীর ব্যবহার করা উচিত। !importantঅন্য কোনও বিকল্প না থাকলে কেবল ব্যবহার করুন ।


1

এটা চেষ্টা কর:

body
{
    font-family:your font;
    font-size:your value;
    font-weight:your value;
}

হাই অ্যাংলিমাস, আমি আপনার কোডটি ফর্ম্যাট করেছি, যদি আপনি 4 টি স্পেস বা {}বোতাম ব্যবহার করেন তবে আপনি উত্তরগুলিতে এইভাবে উদাহরণ কোডটি প্রদর্শন করতে পারেন।
স্টুপারউসার
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.