প্রথম স্তরের টিডি ট্যাগগুলিতে শৈলী প্রয়োগ করুন

Question

কেবলমাত্র এক স্তরের টিডি ট্যাগে ক্লাস 'শৈলী প্রয়োগ করার কোনও উপায় আছে?

<style>.MyClass td {border: solid 1px red;}</style>

<table class="MyClass">
  <tr>
    <td>
      THIS SHOULD HAVE RED BORDERS
    </td>
    <td>
      THIS SHOULD HAVE RED BORDERS
      <table><tr><td>THIS SHOULD NOT HAVE ANY</td></tr></table>
    </td>
  </tr>
</table>

Answer 1

কেবলমাত্র এক স্তরের টিডি ট্যাগে ক্লাস 'শৈলী প্রয়োগ করার কোনও উপায় আছে?

হ্যাঁ ^* :

.MyClass>tbody>tr>td { border: solid 1px red; }

কিন্ত! ' >' সরাসরি সন্তান নির্বাচক IE6 মধ্যে কাজ করে না। আপনার যদি সেই ব্রাউজারটি সমর্থন করতে হয় (যা আপনি সম্ভবত করেন) তবে আপনি যা করতে পারেন তা হ'ল অভ্যন্তরীণ উপাদানটি আলাদাভাবে নির্বাচন করুন এবং স্টাইলটি আন-সেট করুন:

.MyClass td { border: solid 1px red; }
.MyClass td td { border: none; }

---

^* নোট করুন যে প্রথম উদাহরণটি tbodyআপনার এইচটিএমএলে পাওয়া যায় না এমন একটি উপাদানকে উল্লেখ করে । এটি আপনার এইচটিএমএলে থাকা উচিত ছিল , তবে ব্রাউজারগুলি এটিকে ছেড়ে দেওয়ার সাথে সাধারণত ঠিক থাকে ... তারা কেবল এটিকে পর্দার আড়ালে যুক্ত করে।

Comments

আমি এমন একটি বিশ্ব মনে রাখতে কাঁপতে থাকি যেখানে আমরা আই 6 এর জন্য ডিবাগ করতে হয়েছিল। এই পোস্টটি

— শীতলতা

Answer 2

সিএসএস ব্যবহার সম্পর্কে কীভাবে: প্রথম-শিশু সিউডো-ক্লাস:

.MyClass td:first-child { border: solid 1px red; }

Comments

যে কাজ করবে না। এটি tdশিশু গাছের সমস্ত বাচ্চাকে বাছাই করে .MyClassযার মধ্যে তাদের উপাদানগুলির মধ্যে প্রথম রয়েছে এবং এটি অভ্যন্তরের অভ্যন্তরটিকেও স্টাইল করবে td।

— লাজলো

এটি কিভাবে এত upvotes আছে? :first-childওপি সন্ধান করছে তার প্রভাব অবশ্যই আসবে না।

— plong0

Answer 3

এই ধরণ:

table tr td { border: 1px solid red; }
td table tr td { border: none; }

আমাকে দেয়:

এই http://img12.imageshack.us/img12/4477/borders.png

তবে, ক্লাস ব্যবহার করা সম্ভবত এখানে সঠিক পদ্ধতির।

Comments

প্রতিটি একক টিডি এলিমেন্টে একটি ক্লাস ব্যবহার করা কিছুটা রিডানডান্ট হতে পারে, আপনি সম্ভবত টেবিল উপাদানযুক্ত একটি ক্লাস ব্যবহার করতে পারেন এবং তারপরে আপনাকে এখনও দ্বিতীয় স্তরের টেবিলগুলি বাদ দিতে হবে - যেমন আপনার প্রথম উদাহরণটি সঠিক।

— থোমাস্রুটার

Answer 4

কেবলমাত্র একটি মাইক্লাসের ভিতরে টেবিলগুলির জন্য একটি নির্বাচক করুন।

.MyClass td {border: solid 1px red;}
.MyClass table td {border: none}

(সমস্ত অভ্যন্তরীণ টেবিলগুলিতে সাধারণভাবে প্রয়োগ করতে, আপনি এটি করতেও পারেন table table td))

Answer 5

আমি টেবিলের প্রথম কলামটির প্রস্থ নির্ধারণ করতে চেয়েছিলাম এবং এটি পেয়েছি (এফএফ 7 এ) - প্রথম কলামটি 50px প্রশস্ত:

#MyTable>thead>tr>th:first-child { width:50px;}

যেখানে আমার মার্কআপ ছিল

<table id="MyTable">
 <thead>
  <tr>
   <th scope="col">Col1</th>
   <th scope="col">Col2</th>
  </tr>
 </thead>
 <tbody>
   ...
 </tbody>
</table>

Answer 6

আমি মনে করি, এটি কাজ করবে।

.Myclass tr td:first-child{ }

 or 

.Myclass td:first-child { }

Comments

প্রথমটি কি tdপ্রতিটি সারির প্রথমটি এবং দ্বিতীয়টি কেবল tdপৃষ্ঠার প্রথমটি নির্বাচন করে ?

— জোশুয়া পিন্টার

@ জোশুয়াপিন্টার আপনি প্রথমটির বিষয়ে প্রাথমিকভাবে সঠিক। সাধারণভাবে, যে td:first-childকোনও tdউপাদান নির্বাচন করা উচিত যা তার পিতামাতার অধীনে প্রথম উপাদান (তার পিতা বা মাতা যাই হোক না কেন)। প্রথমটি tr td:first-childশর্তটি যুক্ত করে যে tdঅবশ্যই কোনওটির নীচে বাসা বাঁধতে হবে tr(যে কোনও স্তরে, অগত্যা সরাসরি বংশধর নয়)। tr > td:first-childএকটি এর tdঅধীনে প্রথম উপাদান যা একটি নির্বাচন করে tr। সুতরাং শেষ পর্যন্ত :first-childওপি-র প্রশ্নের সমাধানের সাথে কোনও সম্পর্ক নেই এবং এই উত্তরটি ভুল।

— plong0

Answer 7

আমার ধারণা আপনি চেষ্টা করতে পারেন

table tr td { color: red; }
table tr td table tr td { color: black; }

অথবা

body table tr td { color: red; }

যেখানে 'বডি' আপনার টেবিলের পিতামাতার জন্য নির্বাচক

ক্লাসগুলি সম্ভবত এখানে যাওয়ার সঠিক উপায়।