অ্যাঙ্কারগুলির জন্য আন্ডারলাইন (লিঙ্কগুলি) কীভাবে সরাবেন?


312

পৃষ্ঠায় প্রবর্তিত পাঠ্য এবং লিঙ্কগুলির আন্ডারলাইন এড়াতে যাইহোক (সিএসএসে) আছে কি ..?


8
<স্পেনীয়> আপনি কখনই ধরে নিতে পারবেন না যে কোনও ব্রাউজার কীভাবে আপনার এইচটিএমএল রেন্ডার করবে। একটি ট্যাগ একটি অ্যাঙ্করকে রেন্ডার করে যা ব্রাউজারটি ডিফল্টরূপে আন্ডারলাইন হিসাবে প্রদর্শন করতে পছন্দ করে। আপনি একমাত্র আন্ডারলাইন ট্যাগ। নীচের উত্তরগুলি হ'ল সিএসএসের উত্তরসমূহ </ দুল>
ডেড অ্যাকাউন্ট

44
কেউ এই মন্তব্য করতে যথেষ্ট প্যাডেন্টিক যে ব্যঙ্গাত্মক, কিন্তু শব্দটি সঠিকভাবে বানান করার জন্য যথেষ্ট পেডেন্টিক নয় (বা এমনকি ধারাবাহিকভাবে!) আমার মনকে উড়িয়ে দেয়।
টেকনেটিয়াম

নীচের উত্তরগুলি ছাড়াও, হ্যান্ডলিংয়ের a:hoverবিষয়টিও বিবেচনা করা উচিত, সর্বাধিক জনপ্রিয় ব্রাউজারগুলি হোভারিংয়ের পরে অ্যাঙ্করগুলিতে একটি আন্ডারলাইন দেখায়।
Fr0zenFyr

উত্তর:


517

সিএসএস ব্যবহার করুন। এটি আন্ডারলাইনগুলি aএবং uউপাদানগুলি সরিয়ে দেয় :

a, u {
    text-decoration: none;
}

কখনও কখনও আপনাকে উপাদানগুলির জন্য অন্যান্য স্টাইলকে ওভাররাইড করতে হয়, এক্ষেত্রে আপনি !importantআপনার নিয়মে সংশোধকটি ব্যবহার করতে পারেন :

a {
    text-decoration: none !important;
}

1
যদি এর color: black !important;জন্য যুক্ত করা হয় body, তবে এটি কি অ্যাঙ্কর, পরিদর্শন করা অ্যাঙ্গারগুলি, আড়াল হওয়া অ্যাঙ্কারগুলি সহ সব উপাদানকেই কালো রাখবে?
14মেগা

Ωমেগা Δ, স্পষ্টতই নয়, এবং আপনাকে এটি নির্দেশ করার জন্য ধন্যবাদ আমি সামগ্রিকভাবে শরীরের নিয়মে একটি ত্রুটি পেয়েছি। আমি আমার উত্তর আপডেট করেছি।
এমিল বিক্রষ্টম

আমি যা পেয়েছি তা হ'ল যদি আপনি উপাদানটির text-decoration: none !important;জন্য স্টাইল সেট করেন bodyতবে এটি অ্যাঙ্করদের জন্য কাজ করবে যখন আপনি স্পষ্টতই উপাদানগুলির text-decoration: inherit;জন্য শৈলী সেট করবেন a
gaমেগা

7
সাধারণভাবে এড়াতে ভালো !importantএবং ব্যবহার নির্দিষ্টতা এবং ওভাররাইড শৈলীতে cardinality, অন্যথায় আপনি পূর্ণ একটি স্টাইলশীট আপ শেষ করতে পারেন !importantগঠন এটা প্রয়োজনীয় যে কোন অবোধ। এটি একটি কোড গন্ধ আইএমও।
মাইক লিয়নস

!importantহুড়মুড়িয়ে থাকার মতো। তবে একবার আপনি নীচে নামা শুরু করার পরে এবং !importantঅন্যান্য উপাদানগুলি ব্যবহার করার জন্য প্ররোচিত হলে এটি (অনুমান) পেতে পারে এবং সুবিধাটি একটি অচলাবস্থার পক্ষে চলে যায়, যা বিশ্বের পক্ষে দুর্দান্ত, যেমন এমইউডি শান্তি নিশ্চিত করে তবে সিএসএসের বিশ্বে এই জাতীয় শান্তি মানে আপনি কিছু সুবিধা দিতে পারবেন না।
জেসনজেনএক্স

27

সিএসএস হয়

text-decoration: none;

এবং

text-decoration: underline;

16

এটি আপনার রঙের পাশাপাশি অ্যাঙ্কার ট্যাগের আন্ডারলাইনটি সরিয়ে ফেলবে

 a {
     text-decoration: none ;
  }
a:hover
  {
    color:white;
    text-decoration:none;
    cursor:pointer;
   }

11

সহজ বিকল্পটি হ'ল:

<a style="text-decoration: none">No underline</a>

অবশ্যই, এইচটিএমএল (অর্থাত্ ইনলাইন সিএসএস) এর সাথে সিএসএস মিশ্রিত করা ভাল ধারণা নয়, বিশেষত আপনি যখন aসমস্ত জায়গাতেই ট্যাগ ব্যবহার করছেন ।
এজন্য এটিকে পরিবর্তে স্টাইলশিটে যুক্ত করা ভাল ধারণা:

a {
    text-decoration: none;
}

অথবা একটি জেএস ফাইলে এই কোডটিও:

var els = document.getElementsByTagName('a');

for (var el = 0; el < els.length; el++) {
    els[el].style["text-decoration"] = "none";
}

আইফোন / অ্যান্ড্রয়েড ভাল মানদণ্ড নয় কারণ তারা জিমেইল বা আউটলুকের পিছনের দিকের এইচটিএমএল রেন্ডারিংকে উপস্থাপন করে না।
স্টুয়ার্ট

@ এক্সলজিক: আপনাকে অনেক ধন্যবাদ
মনিকা প্যাটেল


6

আপনার পক্ষে সেরা বিকল্প যদি আপনি কেবলমাত্র অ্যাঙ্কর লিঙ্ক থেকে আন্ডারলাইনটি সরাতে চান-

    #content a{
                text-decoration-line:none;
                }

এটি আন্ডারলাইনটি সরিয়ে ফেলবে।

আরও আপনি অন্যান্য স্টাইলকে খুব বেশি কাজে লাগানোর জন্য একই রকম সিনট্যাক্স ব্যবহার করতে পারেন-

                text-decoration: none;
                text-decoration-color: blue;
                text-decoration-skip: spaces;
                text-decoration-style: dotted;

আশাকরি এটা সাহায্য করবে!

পিএস- এটি আমার প্রথম উত্তর!


4

আমার ক্ষেত্রে অ্যাঙ্কর দ্বারা হোভার-ইফেক্ট সম্পর্কে একটি নিয়ম ছিল, এটি এর মতো:

#content a:hover{
border-bottom: 1px solid #333;
}

অবশ্যই, text-decoration:none; এই পরিস্থিতিতে সাহায্য করতে পারে না। আমি এটি খুঁজে না পাওয়া পর্যন্ত আমি অনেক সময় ব্যয় করি।

সুতরাং: একটি আন্ডারস্কোরটি সীমানা-নীচে বিভ্রান্ত হওয়ার দরকার নেই।



2

সমস্যার আরেকটি দৃষ্টিকোণ সরবরাহ করতে (মূল পোস্টের শিরোনাম / বিষয়বস্তু থেকে অনুমান হিসাবে):

আপনি যদি এইচটিএমএলতে দুর্বৃত্তগুলি আন্ডারলাইন তৈরি করছে তা ট্র্যাক করতে চান তবে একটি ডিবাগিং সরঞ্জামটি ব্যবহার করুন। থেকে পছন্দ করে নিন প্রচুর আছে:

ফায়ারফক্সের জন্য রয়েছে ফায়ারব্যাগ;

অপেরার জন্য ড্রাগনফ্লাই (সরঞ্জামসমূহ-> উন্নত মেনুতে "বিকাশকারী সরঞ্জাম" বলা হয়; ডিফল্টরূপে অপেরার সাথে আসে);

আইই এর জন্য "ইন্টারনেট এক্সপ্লোরার ডেভেলপার টুলবার" রয়েছে যা আই 7 এবং এর জন্য পৃথক ডাউনলোড এবং আই 8-তে সংহত হয়েছে (এফ 12 এ আঘাত করুন)।

সাফারি, ক্রোম এবং অন্যান্য সংখ্যালঘু ব্রাউজারগুলি সম্পর্কে আমার কোনও ধারণা নেই তবে আপনার মেশিনে যাইহোক, সম্ভবত উপরের তিনটির মধ্যে একটির থাকা উচিত।



1

যখন আপনি অ্যাঙ্কর ট্যাগটি কেবল যুক্ত স্টাইলিং ছাড়া লিংক হিসাবে ব্যবহার করতে চান (যেমন হোভার বা নীল বর্ণের আন্ডারলাইন) class="no-style"অ্যাঙ্কর ট্যাগটিতে যুক্ত করুন। তারপরে আপনার গ্লোবাল স্টাইলশিটে "নো-স্টাইল" শ্রেণি তৈরি করুন।

.no-style { text-decoration: none !important; }

এর দুটি সুবিধা রয়েছে।

  1. এটি সমস্ত অ্যাঙ্কর ট্যাগগুলিকে প্রভাবিত করবে না, কেবল "নো-স্টাইল" শ্রেণীর সাথে তাদের যুক্ত করা হবে।
  2. এটি অন্য যে কোনও স্টাইলকে ওভাররাইড করবে যা অন্যথায় কারও কাছে পাঠ্য-সজ্জা সেট করা রোধ করতে পারে।

0

লিংক ট্যাগ ব্যবহার করে স্টাইলশিটগুলি অন্তর্ভুক্ত করতে ভুলবেন না

http://www.w3schools.com/TAGS/tag_link.asp

অথবা আপনার ওয়েবপৃষ্ঠায় একটি স্টাইল ট্যাগের মধ্যে সিএসএস বন্ধ করুন।

<style>
  a { text-decoration:none; }
  p { text-decoration:underline; }
</style>

আমি লিঙ্কগুলি বাদ দিয়ে কোনও কিছুর উপর আন্ডারলাইনটি ব্যবহার করার পরামর্শ দেব না, আন্ডারলাইনটি সাধারণত ক্লিকযোগ্য as এটি ক্লিকযোগ্য না হলে এটি আন্ডারলাইন করবেন না।

সিএসএসের বেসিকগুলি ডাব্লু 3 স্কুলে নেওয়া যেতে পারে


0
<u>

একটি অবহেলিত ট্যাগ।

ব্যবহার করুন ...

<span class="underline">My text</span>

সিএসএস ফাইল সহ ...

span.underline
{
    text-decoration: underline;
}  

বা শুধু...

<span style="text-decoration:underline">My Text</span>


0

আন্ডারলাইনটি পাঠ্য সজ্জা নামক একটি CSS সম্পত্তি দ্বারা মুছে ফেলা হতে পারে।

<style>
a{
text-decoration:none;
}
</style>

আপনি যদি একটি বাদে অন্য উপাদানগুলিতে উপস্থিত পাঠ্যের আন্ডারলাইনটি সরাতে চান তবে নীচের বাক্য গঠনটি ব্যবহার করা উচিত।

<style>
element-name{
text-decoration:none;
}
</style>

অন্যান্য অনেকগুলি পাঠ্য-সজ্জা মান রয়েছে যা আপনাকে লিঙ্কগুলি ডিজাইন করতে সহায়তা করতে পারে।


-1

ওয়েব মুদ্রণের ক্ষেত্রে আমি এই সমস্যাটি নিয়ে সমস্যায় পড়েছি এবং সমাধান করেছি। যাচাই ফলাফল

a {
    text-decoration: none !important;
}

এটি কাজ করে!

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