পাঠ্য অবতরণকারীদের সাথে সংঘর্ষের আন্ডারলাইন করা উচিত?


12

সিএসএস 3 এর পাঠ্য-সজ্জা মডিউলে একটি পাঠ্য-আন্ডারলাইন-অবস্থান বৈশিষ্ট্য অন্তর্ভুক্ত রয়েছে , যা পুরো পাঠ্যের নীচে আন্ডারলাইনটি অবস্থান করা উচিত কিনা তা উল্লেখ করে:

          এখানে চিত্র বর্ণনা লিখুন

বা বেসলাইন এর ঠিক নীচে, এটি পাঠ্য অবতরণকারীদের সাথে সংঘর্ষের সুযোগ দেয়:

          এখানে চিত্র বর্ণনা লিখুন

ঠিক আছে, আমরা সবাই জানি কীভাবে আন্ডারলাইনটি কেবলমাত্র সর্বশেষ অবলম্বন হিসাবে ব্যবহার করা উচিত, তবে ... আপনি যদি এটি ব্যবহার করতে চলেছেন তবে এটি করার সবচেয়ে সাধারণ উপায় কী? প্রতিটি আন্ডারলাইন শৈলীর উপকারিতা এবং কি কি?


1
সিএসএস সম্পর্কে: এটি CSS3 jsfiddle.net/lollero/B45A4 ছাড়াই অর্জনযোগ্য (উন্নত ব্রাউজার সমর্থন Also এছাড়াও আপনাকে উদাহরণস্বরূপ একটি ড্যাশযুক্ত আন্ডারলাইন তৈরি করতে দেয়))
জুনাস

এই খুব সমস্যা মোকাবেলায় একটি ওপেন-সোর্স লাইব্রেরি তৈরি করুন: eager.io/show کیس / SmartUnderline
আদম

উত্তর:


7

সবচেয়ে সাধারণ কি?

ঠিক আছে, কিছু টাইপোগ্রাফাররা বলবেন যে আন্ডারলাইনিং সম্ভবত সমস্ত একসাথে এড়ানো উচিত , এবং সেই আন্ডারলাইনটি কেবল টাইপরাইটারগুলিতে বা ওয়েবে হাইপারলিঙ্কগুলিতে ব্যবহারের জন্য উপযুক্ত। যাইহোক, আমি যুক্ত করব যে সৃজনশীলতা হ'ল সৃজনশীল উপায়ে নিয়ম ভাঙার সুযোগগুলি দেখানো যাতে আপনি এই নির্দেশিকাটিকে আপনার পক্ষে কতটা করতে চান।

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

টাইপরাইটারগুলিতে, ওভারল্যাপগুলি ওভারল্যাপগুলিকে আন্ডারলাইন করে তবে কিছুটা ভিন্নভাবে: এটি আপনার দুটি উদাহরণের ( উদাহরণস্বরূপ ) মধ্যে কিছুটা অংশ পড়ে । আপনি যদি উতরকের বেসলাইনটি দেখুন, যেমন নীচের লুপের নীচে লুপ gবা p(একটি সেরিফ ফন্টে) এর নীচের সেরিফটি , সেখানেই আন্ডারলাইনটি মিথ্যা। সুতরাং এটি বংশধরদের নীচে "যোগ দেয়"।

সুবিধা - অসুবিধা

আপনার বংশধরদের সাথে আন্ডারলাইন ওভারল্যাপ হওয়ার সুবিধাটি হ'ল এটি আপনার লাইন স্পেসিংকে (বা "শীর্ষস্থানীয়") কোনওভাবেই প্রভাবিত করে না - আন্ডারলাইনটি সামঞ্জস্য করার জন্য আপনাকে লাইনগুলির মধ্যে ফাঁক বাড়াতে হবে না।

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

আপনি যদি ওয়েবটি ব্যবহার করছেন তবে নিম্নরেখাঙ্কনটি হাইপারলিংকের সাথে বেশি যুক্ত। সুতরাং, কোনও লিঙ্কের অংশ নয় এমন পাঠ্যের জন্য আন্ডারলাইনের কোনও ব্যবহার এড়ানো উচিত। বোঝান কি আপনি অন্য কোনো উপায়ে বোঝান চাই - ব্যবহার সাহসী , তির্যক অথবা সমস্ত পরিবর্তে ক্যাপ।


6

এটি আমার বিশ্বাস যে কোনও আন্ডারলাইন করা পাঠ্যটি সাধারণত এতটাই ছোট যে পার্থক্যটি পাঠকের কাছে অস্তিত্বহীন। এই হল ঐ যে ডিজাইনার একটি যত্ন করতে এক মহান চুক্তি সম্পর্কে, কিন্তু পাঠকদের কি না। এটি আমার মতে স্টাইলিস্টিক পছন্দ।

আমি বংশধরদের বিরতিতে বেসলাইন অবস্থানকে অনেক বেশি পছন্দ করি: text-decoration-skip: ink;যদিও এটি বর্তমানে সমর্থিত নয়। আমি দুটি ক্লাস করতে এবং এখান থেকে আন্ডারলাইন সরানোর জন্য বংশধরদের সাথে একটি স্প্যান যুক্ত করতে এতদূর গিয়েছি gone (টেক্সট পিএইচপি এর মাধ্যমে প্রতিস্থাপন করুন এটি তৈরি করার মতো অনেক কোড নয়)।

অফসেটের কারণে আমি কখনই সীমান্ত-নীচের কৌশল (বা নীচের বৈশিষ্ট্য) ব্যবহার করব না। আমি আমার পাঠকদের সাথে দেখতে পেয়েছি যে আন্ডারলাইনটির অফসেটটি তাদের কাছে যে কোনও কিছুর চেয়ে অনেক বেশি দূরে, আরও বেশি বিভ্রান্তিকর।

আমি চেষ্টা করি এবং যখনই সম্ভব যখন আন্ডারলাইন না করে গা bold়, তির্যক, বোল্ড তাত্পর্য বা রঙের বৈচিত্রগুলিতে স্যুইচ করি।


(ক) উল্লেখ করার জন্য +1 text-decoration-skip: ink;এবং (খ) বংশধরদের নীচের নীচে আপনার আন্ডারলাইন স্থাপন করতে বাধ্য বোধ করছে না।
সাম্পাব্লুকুপার

1
মার্চ 2018 হিসাবে পাঠ্য-সজ্জা-এড়িয়ে যান - কালি: অটো | কোনওটি ক্রোমে ডিফল্টরূপে সক্ষম নয় (and৪ এবং তার পরে)। প্রাথমিক মান: অটো এটি অন্য ব্রাউজারগুলিতেও আসবে বলে মনে হচ্ছে।
mdahlman

6

বর্ণনাtext-decoration: underline CSS এ 2.1 বৈশিষ্ট, শুধু নিম্নরেখাঙ্কিত যেমন তার প্রভাব সংজ্ঞায়িত বিবরণ ছাড়া, কিন্তু ব্রাউজার বেসলাইন নিচে শুধু একটু প্রকাশমান যেমন বাস্তবায়ন। সুতরাং, এটি প্রায়শই অবতরণকারীকে কাটা হয় (এবং একটি বর্ণের নীচে স্থাপন করা ডায়াক্রিটিক চিহ্ন)।

সিএসএস 3 পাঠ্য খসড়ায়, text-underline-positionঅবস্থান রয়েছে তবে এটি কোনও ব্রাউজার দ্বারা সমর্থিত বলে মনে হচ্ছে না। ( Css666.com তথ্য অনুসারে , এটি আইআই দ্বারা সমর্থিত তবে কমপক্ষে আইই 9 তে সমর্থনটি সম্পত্তি সনাক্তকরণ এবং মান auto, প্রাথমিক মান গ্রহণের মধ্যে সীমাবদ্ধ বলে মনে হয় - তাই এটি সত্যই সমর্থন করে না)) আপডেট : আসলে , IE (সংস্করণ 6 থেকে) এর আরও কিছুটা সমর্থন রয়েছে , তবে এটি আপনাকে সত্যিই কেবল নীচে পাঠ্যের (!) উপরে আন্ডারলাইন রাখতে দেয়।

স্কটের জবাব এবং জুনাসের মন্তব্যে বর্ণিত হিসাবে আপনি আন্ডারলাইনটি অনুকরণ করতে নীচের সীমানাটি ব্যবহার করতে পারেন এবং তারপরে "আন্ডারলাইন" শৈলীতে আপনার যথেষ্ট নিয়ন্ত্রণ থাকতে পারে। এটি উপযুক্ত হতে পারে উদাহরণস্বরূপ লিঙ্কগুলির জন্য যা নিজেরাই দাঁড়ায়, ইনলাইন নয়। ইনলাইন পাঠ্যের জন্য, যেখানে আপনি আন্ডারলাইন করতে ইচ্ছুক হতে পারেন যেমন আপনি এইচটিএমএল-আইজিং মুদ্রিত পদার্থ যা আন্ডারলাইনিং অন্তর্ভুক্ত রয়েছে, সাধারণ সিএসএস আন্ডারলাইনিং সম্ভবত আরও ভাল - কারণ এই জাতীয় কমবেশি মুদ্রণের printতিহ্যের সাথে মিল রয়েছে।

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