এইচটিএমএল: পাঠ্যের স্ট্রিংয়ে নির্দিষ্ট শব্দের রং পরিবর্তন করা


91

আমার নীচের বার্তাটি রয়েছে (কিছুটা পরিবর্তন হয়েছে):

"৩০ শে জানুয়ারী, ২০১১ এর মধ্যে প্রতিযোগিতায় প্রবেশ করুন এবং আপনি গ্রীষ্মকালীন আশ্চর্যজনক ট্রিপ সহ $$$$ পর্যন্ত জিততে পারবেন!"

আমার বর্তমানে আছে:

<p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;">

পাঠ্য স্ট্রিংটির ফর্ম্যাট করা, তবে "জানুয়ারী 30, 2011" এর রঙটি # এফএফ 10000 এবং "গ্রীষ্ম" থেকে # 0000A0 তে পরিবর্তন করতে চান।

এইচটিএমএল বা ইনলাইন সিএসএস দিয়ে আমি কীভাবে এই কাজটি করব?

উত্তর:


116
<p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;">
  Enter the competition by 
  <span style="color: #ff0000">January 30, 2011</span>
  and you could win up to $$$$ — including amazing 
  <span style="color: #0000a0">summer</span> 
  trips!
</p>

অথবা আপনি পরিবর্তে সিএসএস ক্লাস ব্যবহার করতে চাইতে পারেন:

<html>
  <head>
    <style type="text/css">
      p { 
        font-size:14px; 
        color:#538b01; 
        font-weight:bold; 
        font-style:italic;
      }
      .date {
        color: #ff0000;
      }
      .season { /* OK, a bit contrived... */
        color: #0000a0;
      }
    </style>
  </head>
  <body>
    <p>
      Enter the competition by 
      <span class="date">January 30, 2011</span>
      and you could win up to $$$$ — including amazing 
      <span class="season">summer</span> 
      trips!
    </p>
  </body>
</html>

4
এটি একটি দুর্দান্ত উত্তর! সহজেই প্রদর্শিত হয় যে বিন্দুগুলি অনুচ্ছেদে ট্যাগগুলির মধ্যে ট্যাগগুলি উপস্থাপন করে। এটি <স্টাইল> এর সাথে যে কেউ কাজ করছেন তার পক্ষে এই তথ্যটি সত্যই স্পষ্ট করে।
জোসেফ পুইয়ার

44

আপনি এইচটিএমএল 5 ট্যাগ ব্যবহার করতে পারেন <mark>:

<p>Enter the competition by 
<mark class="red">January 30, 2011</mark> and you could win up to $$$$ — including amazing 
<mark class="blue">summer</mark> trips!</p>

এবং এটি সিএসএসে ব্যবহার করুন:

p {
    font-size:14px;
    color:#538b01;
    font-weight:bold;
    font-style:italic;
}

mark.red {
    color:#ff0000;
    background: none;
}

mark.blue {
    color:#0000A0;
    background: none;
}

ট্যাগটিতে <mark>একটি ডিফল্ট ব্যাকগ্রাউন্ড রঙ থাকে ... কমপক্ষে ক্রোমে।


4
দুঃখের বিষয় যে উত্তরটি পুরষ্কার দেওয়া হয়নি। আমি এটি এটিকে পুরষ্কার দিতাম (এবং যারা ব্রাউজারগুলি এইচটিএমএল সমর্থন করে না (তাদের এখনও রয়েছে কি?) তাদের কাছে
প্রতারণা করা হয়েছে

একটি সহজ এবং কার্যকর সমাধান যা ওপি অনুরোধের চেয়ে বেশি, এবং কম নয়।
ভিক্টর Stoddard

চিহ্ন ট্যাগ বিন্যাসের জন্য ব্যবহার করা বোঝানো হয় না।
জেসিকা বি

মূল উত্তরের চমৎকার বিকল্প!
জোসেফ পুইয়ার

35
<p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;">
    Enter the competition by <span style="color:#FF0000">January 30, 2011</span> and you could win up to $$$$ — including amazing <span style="color:#0000A0">summer</span> trips!
</p>

স্প্যান উপাদানগুলি ইনলাইন হয় এবং এইভাবে অনুচ্ছেদের প্রবাহটি ভাঙবে না, কেবল ট্যাগগুলির মধ্যে শৈলী।


20

স্প্যান ব্যবহার করুন। প্রাক্তন)<span style='color: #FF0000;'>January 30, 2011</span>


16
<font color="red">This is some text!</font> 

এটি আমার পক্ষে সবচেয়ে ভাল কাজ করেছিল যখন আমি কেবল একটি বাক্যে একটি শব্দকে রঙিন রঙে পরিবর্তন করতে চেয়েছিলাম।


<font color = "red"> এটি কিছু পাঠ্য! </ font>
ব্যবহারকারী 8588011

4
এটি এইচটিএমএল 5 এ সমর্থিত নয়
স্টিফেন

2

আপনি একটি ক্লাসও করতে পারেন:

<span class="mychangecolor"> I am in yellow color!!!!!!</span>

তারপরে একটি সিএসএস ফাইলে করুন:

.mychangecolor{ color:#ff5 /* it changes to yellow */ }

2

এই কোডটি টেইলর করুন তবে আপনি নিজের প্রয়োজন অনুসারে ফিট করতে চান, আপনি কি পাঠ্য নির্বাচন করতে পারেন? অনুচ্ছেদে আপনার কী ফন্ট বা শৈলী প্রয়োজন!

<head>
<style>
p{ color:#ff0000;font-family: "Times New Roman", Times, serif;} 
font{color:#000fff;background:#000000;font-size:225%;}
b{color:green;}
</style>
</head>
<body>
<p>This is your <b>text. <font>Type</font></strong></b>what you like</p>
</body>

-2

আপনি দীর্ঘ দীর্ঘতর উপায় ব্যবহার করতে পারেন

<p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;">Enter the competition by</p><p style="font-size:14px; color:#ff00; font-weight:bold; font-style:italic;">summer</p> 

আপনি বাকি জন্য পয়েন্ট পেতে

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