আমি কি ফন্ট আশ্চর্য আইকনের রঙ পরিবর্তন করতে পারি?

Question

<a>কোনও কারণে আমাকে আমার আইকনটি একটি ট্যাগের মধ্যে আবদ্ধ করতে হবে ।
কোনও ফন্ট-বিস্ময়কর আইকনের রঙকে কালো করে তোলার কোনও সম্ভাব্য উপায় কী?
বা এটি কোনও <a>ট্যাগের মধ্যে আবৃত হওয়া অবধি কি অসম্ভব ? হরফ হ'ল ফন্টটি ছবি হবার কথা নয়?

<a href="/users/edit"><i class="icon-cog"></i> Edit profile</a>

Comments

হরফ আইকন রঙ, আকার এবং ছায়াছবি ফন্ট আশ্চর্য আইকনগুলির কীভাবে স্টাইল করবেন তার

— জেমস ডোনেলি

এটি দেখুন: fortawesome.github.io/Font-Awesome/ উদাহরণ

— মোহাম্মদ জমির

Answer 1

এটি আমার পক্ষে কাজ করেছে:

.icon-cog {
  color: black;
}

7..0.০ এর উপরে হরফের ফন্টের সংস্করণের জন্য এটি দেখতে এটি:

.fa-cog {
  color: black;
}

Comments

@ ইভান্স ধন্যবাদ তবে সমস্যাটি হ'ল আমি মাঝে মাঝে <i class = "আইকন-কগ আইকন-হোয়াইট"> কালো রঙের টেবিলের ঘরে রাখি। আপনার সিএসএস এটিকে

— কালোতেও

আপনি নিম্নলিখিতটি যুক্ত করতে পারেন: .icon-cog.icon- সাদা {রঙ: সাদা; }

— ইভান হান

সবেমাত্র এটি জুড়ে এসেছিল - আমি দেখতে পেলাম যে সমস্ত আইকনগুলিতে 'ফা' এর ক্লাস যুক্ত করা এবং তারপরে .fa {color: green;}কৌশলটি করা হয়েছে। তারপরে .fa.icon-white {color: white;}আপনি উপরের মত একই প্রভাব পেতে করতে পারেন।

— ক্লার্কবয়

এটি কি পরিবর্তন সম্ভবbackground-color

— vamsikrishnamannem

পছন্দ করুন আপনি background-color: #112233সিএসএসে যুক্ত করতে পারেন । একটি উদাহরণের জন্য এই কোডটি দেখুন ।

— ইভান হান

Answer 2

এইচটিএমএল:

    <i class="icon-cog blackiconcolor">

সিএসএস:

    .blackiconcolor {color:black;}

আপনি বোতাম আইকনে অতিরিক্ত ক্লাস যুক্ত করতে পারেন ...

Comments

এটি একটি সুন্দর, ঝরঝরে সমাধান। আমি এফএ-কালো বা এফ-ব্লুয়ের মতো একটি এফ উপসর্গের সাথে ক্লাসের নাম রাখতে পছন্দ করি কেবল এটি স্পষ্ট করতে আমি তাদের দুর্দান্ত আইকনে ফন্টে প্রয়োগ করছি।

— ডেভিডহ্যোগো

Answer 3

আপনি স্টাইল বৈশিষ্ট্যে রঙটি নির্দিষ্ট করতে পারেন:

<a href="/users/edit"><i class="icon-cog" style="color:black"></i> Edit profile</a>

Comments

-1 প্রথমত, এটি ভুল, কারণ এটি অনুরোধ হিসাবে কেবলমাত্র আইকনের রঙ নয়, পাঠ্যের রঙও পরিবর্তন করবে। দ্বিতীয়ত, ইনলাইন সিএসএস ব্যবহার করে প্রচার করা উচিত নয়।

— অ্যাড্রিয়ান শ্মিট

পাঠ্যটির রঙ নয়, প্রশ্নটি কোথায় "আইকনটির রঙ" বলে?

— dandrews

আমি মনে করি এটি স্পষ্টতই প্রশ্নটির উপায় দ্বারা বোঝানো হয়েছে। এবং মনে হচ্ছে আপনি সম্মত হবেন, যেহেতু আপনি নিজের উত্তর আপডেট করেছেন :)

— অ্যাড্রিয়ান

আমি একটি ছোট ইঙ্গিত দিতে চাই Bootstrap। ক্লাস <i> ব্যবহার করে ট্যাগ করুন text-primary, আইকনের রঙকে নীল হিসাবে ওভাররাইড করুন। সুতরাং এটি সম্পর্কে সচেতন হতে ভাল।

— এলিয়া

Answer 4

আপনার পুরো প্রকল্পের জন্য হরফ আইকন রঙ পরিবর্তন করতে আপনার সিএসএসে এটি ব্যবহার করুন

.fa {
  color : red;
}

Comments

এটি দুর্দান্ত তবে আমার প্রকল্পের সমস্ত আইকন পরিবর্তন করে। আমি .fa-black {রঙ: # 000; like এর মতো ক্লাস তৈরি করেছি} আমি তখন আইকনগুলিতে ফাই-ব্ল্যাক ক্লাস যুক্ত করেছি যেখানে আমি আলাদা রঙ চেয়েছিলাম wanted

— ডেভিডহ্যোগো

Answer 5

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

<i class="icon-cog text-red">
<i class="icon-cog text-blue">
<i class="icon-cog text-yellow">

Comments

এবং কোথা থেকে আসে text-red, text-blueবা text-yellowকোথা থেকে আসে?

— কলিডিয়ার

এটি বুটস্ট্র্যাপ ক্লাস থেকে আসে

— রাহুল তাতোদোদ

Answer 6

আপনি যদি সিএসএস ফাইলটি পরিবর্তন করতে না চান তবে আমার পক্ষে এটি কাজ করে। এইচটিএমএলতে, রঙের সাথে শৈলী যুক্ত করুন:

<i class="fa fa-cog" style="color:#fff;"></i>

Answer 7

এই ধরণের বোতামটিতে কেবল কগ-আইকনগুলি হিট করতে, আপনি বোতামটি একটি শ্রেণি দিতে পারেন, এবং কেবলমাত্র বোতামের অভ্যন্তরে আইকনের জন্য রঙ সেট করতে পারেন।

এইচটিএমএল:

<a class="my-nice-button" href="/users/edit">
    <i class="icon-cog"></i>
    Edit profile
</a>

সিএসএস:

.my-nice-button>i { color: black; }

এটি এমন কোনও আইকন তৈরি করবে যা আপনার বোতামের প্রত্যক্ষ বংশধর কালো।

Answer 8

Font-Awesomeআইকনগুলির সর্বশেষতম সংস্করণ ব্যবহার করা হয় বা আপনি যদি faক্লাস ব্যবহার করেন তবে @ ক্লার্কবয় উত্তর সম্পর্কিত রেফারেন্স সহ নীচের কোডটি ভাল কাজ করে

.fa.icon-white {
    color: white;
}

এবং তারপরে icon-whiteবিদ্যমান ক্লাসে যুক্ত করুন

Answer 9

.fa-search{
    color:#fff;
 }

আপনি সেই কোডটি সিএসএসে লেখেন এবং এটি রঙটি সাদা বা কোনও রঙে পরিবর্তন করতে চান আপনি এটি নির্দিষ্ট করে দিন

Answer 10

আপনি যা চান ঠিক তেমন পাঠ্য শৈলী দিন: ডি এইচটিএমএল:

<a href="javascript:;" class="fa fa-trash" style="color:#d9534f;">
   <span style="color:black;">Text Name</span>
</a>

Answer 11

আপনি যা চান তা কেবল স্টাইলটি দিন

style="color: white;font-size: 20px;"

Answer 12

সম্পত্তি ব্যবহার করে আপনি কোনও ফন্টউইজ আইকনের রঙের অগ্রভাগের রঙ পরিবর্তন করে পরিবর্তন করতে পারেন । নিম্নলিখিত উদাহরণগুলি:css color

<i class="fa fa-cog" style="color:white">

---

এটি এসভিজিগুলিকেও সমর্থন করে

<style>
.fa-cog{
color:white;
}
</style>

---

<style>
.parent svg, .parent i{
color:white
}
</style>

<div class="parent">
  <i class="fa fa-cog" style="color:white">
</div>

---

Answer 13

এই কোডটি একই লাইনে লিখুন, এটি আইকনের রঙ পরিবর্তন করে:

<li class="fa fa-id-card-o" style="color:white" aria-hidden="true">

Answer 14

আপনি যদি কোনও নির্দিষ্ট আইকনের রঙ পরিবর্তন করতে চান তবে আপনি এই জাতীয় কিছু ব্যবহার করতে পারেন:

.fa-stop {
    color:red;
}

Answer 15

আপনি বুটস্ট্র্যাপ শ্রেণীর সাথে ফন্ট আশ্চর্য আইকন রঙ পরিবর্তন করতে পারেন

ব্যবহার

text-color

উদাহরণ

text-white

Answer 16

আমার জন্য কেবলমাত্র কাজটি হ'ল ইনলাইন সিএসএস + ওভাররাইড

<i class="fas fa-ellipsis-v fa-2x" style="color:red !important"></i>

Answer 17

এইচটিএমএল:

<i class="icon-cog blackiconcolor">

সিএসএস:

 .blackiconcolor {color:black;}

ক্লাস ব্যবহার করা আপনাকে একটি নিখরচায় বাধ্যবাধকতা সম্পত্তি দেবে যা আপনি আপনার যে কোনও ট্যাগের জন্য প্রয়োগ করতে পারেন।

Comments

-1 হরফ হরফ আইকন হ'ল পাঠ্য, তাই নাম। সেগুলি অন্য কোনও পাঠ্যের মতো সিএসএস ব্যবহার করে রঙিন করা উচিত, বিক্রেতা-নির্দিষ্ট কৌশলগুলি ব্যবহার না করে। এছাড়াও, যেহেতু তারা পাঠ্য, তাই তারা ইতিমধ্যে কালো-সাদা (বা মনো-বর্ণ)।

— অ্যাড্রিয়ান শ্মিট

@ অ্যাড্রিয়ানশ্মিট উপরে বর্ণিত উত্তরটি একটি চিত্রকে কালোতে রূপান্তরিত করার জন্য, আমি এর সাথে হরফের রঙ পরিবর্তন করতে চাইনি, আমি আশা করি আপনি আমাকে পেয়ে

— যাবেন

আমি বুঝেছি. উত্তর যদিও এখনও প্রশ্নের ক্ষেত্রে ভুল। ফন্টের দুর্দান্ত আইকনগুলি চিত্র নয়, তারা পাঠ্য text

— অ্যাড্রিয়ান শ্মিড্ট