সিএসএস সহ কোনও টেবিলের tr
প্রথমটি বাদে আমি কীভাবে সমস্ত উপাদান নির্বাচন করতে পারি tr
?
আমি এই পদ্ধতিটি ব্যবহার করার চেষ্টা করেছি , কিন্তু দেখেছি এটি কার্যকর হয়নি।
<tr>
শ্রেণীর এবং বাকি অংশগুলির জন্য একটি পৃথক শ্রেণি।
সিএসএস সহ কোনও টেবিলের tr
প্রথমটি বাদে আমি কীভাবে সমস্ত উপাদান নির্বাচন করতে পারি tr
?
আমি এই পদ্ধতিটি ব্যবহার করার চেষ্টা করেছি , কিন্তু দেখেছি এটি কার্যকর হয়নি।
<tr>
শ্রেণীর এবং বাকি অংশগুলির জন্য একটি পৃথক শ্রেণি।
উত্তর:
প্রথম tr
বা তার পরেরগুলির মধ্যে একটি ক্লাস যুক্ত করে tr
। আপনারা কেবল সিএসএসের সাহায্যে সারিগুলি বেছে নেওয়ার কোনও ক্রসব্রোজার উপায় নেই।
তবে, আপনি যদি ইন্টারনেট এক্সপ্লোরার 6, 7 বা 8 এর বিষয়ে চিন্তা না করেন:
tr:not(:first-child) {
color: red;
}
tr:not(:first-of-type)
সম্ভাব্য সমাধান হিসাবে উল্লেখ করতে চাই , যদি আপনি প্রথম সাধারণীকরণকৃত সন্তানের পরিবর্তে কোনও নির্দিষ্ট নির্বাচকের প্রথম সন্ধান করেন।
আমি অবাক হয়েছি কেউ ভাইবোন সংযুক্তকারীগুলির ব্যবহারের কথা উল্লেখ করেনি, যা আই 7 এবং এর পরে সমর্থিত:
tr + tr /* CSS2, adjacent sibling */
tr ~ tr /* CSS3, general sibling */
তারা উভয়ই ঠিক একইভাবে কাজ করে (যেভাবেই এইচটিএমএল টেবিলের প্রসঙ্গে):
tr:not(:first-child)
elem + elem
আপনি যে উপাদানগুলিকে টার্গেট করতে চান তা কেবলমাত্র শিশুদের নয় যখন এটির জন্য একটি দুর্দান্ত সাধারণ সমাধান। উদাহরণস্বরূপ, যদি একটি <h2>
বেশ কয়েকটি <p>
ট্যাগ অনুসরণ করে তবে প্রথম<p>
সেই ক্ষেত্রে প্রথমটি প্রথম সন্তানের নয়।
আদর্শ সমাধান তবে IE তে সমর্থিত নয়
tr:not(:first-child) {css}
দ্বিতীয় সমাধানটি হ'ল সমস্ত টিআর স্টাইল করা এবং তারপরে প্রথম সন্তানের জন্য সিএসএস দিয়ে ওভাররাইড করা:
tr {css}
tr:first-child {override css above}
আপনি যে 'প্রথম লাইনটির' কথা বলছেন তা হ'ল এটি হ'ল আপনার টেবিল-শিরোনাম - সুতরাং আপনার ব্যবহার সম্পর্কে thead
এবং tbody
আপনার মার্কআপে ( এখানে ক্লিক করুন ) যা ভাবতে হবে যা 'আরও ভাল' মার্কআপের জন্য তৈরি করবে (শব্দার্থগতভাবে সঠিক, স্ক্রিনডারদের মতো জিনিসগুলির জন্য দরকারী) ) এবং সহজ, সিএসএস-নির্বাচনের জন্য ক্রস-ব্রাউজার-বান্ধব সম্ভাবনা ( table thead ... { ... }
)
যদিও প্রশ্নের ইতিমধ্যে একটি শালীন উত্তর রয়েছে, আমি কেবল জোর দিয়ে বলতে চাই যে :first-child
ট্যাগটি শিশুদের প্রতিনিধিত্ব করে এমন আইটেমের ধরণে চলে।
উদাহরণস্বরূপ, কোডে:
<div id"someDiv">
<input id="someInput1" />
<input id="someInput2" />
<input id="someInput2" />
</div
আপনি যদি মার্জিনের সাথে কেবলমাত্র দ্বিতীয় দুটি উপাদানকে প্রভাবিত করতে চান তবে প্রথমটি নয়, আপনি যা করবেন:
#someDiv > input {
margin-top: 20px;
}
#someDiv > input:first-child{
margin-top: 0px;
}
এটি হ'ল যেহেতু input
এস বাচ্চারা, আপনি first-child
নির্বাচকটির ইনপুট অংশে রাখবেন।
দুঃখিত, আমি জানি এটি পুরানো তবে কেন আপনি সমস্ত টিআর এলিমেন্টকে প্রথমে চান এবং স্টুডো ক্লাসটি ব্যবহার না করে সেভাবে স্টাইল করবেন না: প্রথম বাচ্চা যেখানে আপনি সমস্ত টিআর উপাদানগুলির জন্য নির্দিষ্ট করেছেন তা প্রত্যাহার করেন।
এই উদাহরণ দ্বারা বর্ণিত ভাল:
tr {
border-top: 1px solid;
}
tr:first-child {
border-top: none;
}
/ Patrik
অন্য বিকল্প:
tr:nth-child(n + 2) {
/* properties */
}
কেউ হয়ত উপকৃত হতে পারেন, নীচে আমি ব্যবহার করেছি
ol li:not(:first-child) {
background: black;
color: white;
}
আপনি নিজের সিএসএসে সিউডো ক্লাস সিলেক্টরটি এর মতো ব্যবহার করতে পারেন:
.desc:not(:first-child) {
display: none;
}
এটি ক্লাসটি প্রথম উপাদানটিতে ক্লাস প্রয়োগ করবে না .ডেস্ক।
এখানে একটি জেএসফিটাল একটি উদাহরণ রয়েছে: http://jsfiddle.net/YYTFT/ , এবং এটি ছদ্ম শ্রেণীর নির্বাচকদের ব্যাখ্যা করার জন্য একটি ভাল উত্স: http://css-tricks.com/pseudo-class-selectors/
first-child
ক্লাস উপেক্ষা।
আপনি নিজের ক্লাস তৈরি করতে এবং ক্লাসটি ব্যবহার করতে পারবেন যখন আপনি নিজের ভবিষ্যতের যেগুলি সিএসএস দ্বারা নির্বাচিত হতে চান (বা চান না) এর সমস্ত সংজ্ঞা দেয়।
এটি লেখার মাধ্যমে করা হবে
<tr class="unselected">
এবং তারপরে আপনার CSS তে লাইনগুলি রয়েছে (এবং উদাহরণ হিসাবে টেক্সট-সারিবদ্ধ কমান্ডটি ব্যবহার করে):
unselected {
text-align:center;
}
selected {
text-align:right;
}