سؤال

إذا كان لدي التالية div:

<div class="sectionA" id="content">
    Lorem Ipsum...
</div>

هل هناك طريقة لتحديد النمط الذي يعبر عن فكرة "شعبة مع id='content' و class='myClass'"?

أو هل لديك ببساطة الذهاب بطريقة أو بأخرى كما في

<div class="content-sectionA">
    Lorem Ipsum...
</div>

أو

<div id="content-sectionA">
    Lorem Ipsum...
</div>
هل كانت مفيدة؟

المحلول

في ورقة الأنماط الخاصة بك:

div#content.myClass

تحرير:هذه قد تساعد أيضا:

div#content.myClass.aSecondClass.aThirdClass /* Won't work in IE6, but valid */
div.firstClass.secondClass /* ditto */

و في المثال الخاص بك:

div#content.sectionA

تحرير 4 سنوات: لأن هذا هو السوبر القديم و الناس تبقى العثور عليه: لا استخدام tagNames في محددات. #content.myClass هو أسرع من div#content.myClass لأن tagName يضيف تصفية الخطوة التي لا تحتاج. استخدام tagNames في محددات فقط حيث يجب!

نصائح أخرى

وهناك اختلافات بين #header .callout و#header.callout في المغلق.

وهنا هو "سهل الانجليزية" من #header .callout:
تحديد كافة العناصر مع اسم الفئة callout التي ينحدرون من العنصر بمعرف header.

و#header.callout يعني:
حدد العنصر الذي لديه معرف header وكذلك اسم فئة من callout.

ويمكنك قراءة المزيد هنا الحيل المغلق

وحسنا بوجه عام يجب أن لا حاجة لتصنيف عنصر المحدد من قبل الهوية، لأن الهوية هي دائما فريدة من نوعها، ولكن إذا كنت حقا بحاجة إلى ذلك، يجب أن تعمل ما يلي:

div#content.sectionA {
    /* ... */
}

وهناك شيء خاطئ مع الجمع بين الهوية وفئة على عنصر واحد، ولكن يجب أن لا حاجة إلى التعرف عليه من قبل كل من لقاعدة واحدة. إذا كنت تريد حقا أن يمكنك القيام به:

#content.sectionA{some rules}

وأنت لا تحتاج إلى div أمام ID كما فعل آخرون اقترحوا.

في عام، قواعد CSS محددة لهذا العنصر يجب تعيين مع الهوية، وتلك هي الذهاب الى تحمل وزنا أكبر من تلك التي فقط الطبقة. أن قواعد المحددة من قبل الطبقة يكون الخصائص التي تنطبق على العناصر المتعددة التي كنت لا تريد تغيير في أماكن متعددة في أي وقت تحتاج إلى ضبط.

وهذا يتلخص هذا:

 .sectionA{some general rules here}
 #content{specific rules, and overrides for things in .sectionA}

تأكد معنى؟

أنت <م> يمكن الجمع بين الهوية وفئة في CSS، ولكن المقصود معرفات لتكون فريدة من نوعها، وذلك إضافة إلى الطبقة محدد CSS أن الإفراط في التأهل ذلك.

والاستخدام:. tag.id ; tag#classin المتغيرات العلامة في المغلق الخاص بك

من المفترض

ومعرفات ليكون وثيقة فريدة من نوعها على نطاق واسع، لذلك يجب أن لا يكون لتحديد القائمة على حد سواء. يمكنك تعيين عنصر فئات متعددة ولكن مع class="class1 class2"

أعتقد أنك خاطئ.معرفات مقابل فئة ليست مسألة النوعية ؛ لديهم مختلف تماما المنطقي يستخدم.

معرفات ينبغي أن تستخدم لتحديد أجزاء معينة من الصفحة:رأس, شريط التنقل, المادة الرئيسية ، المؤلف ، تذييل الصفحة.

دروس عن كيفية استخدام الأساليب إلى الصفحة.دعونا نقول لديك العامة موقع المجلة.كل صفحة على الموقع سوف يكون نفس العناصر-رأس, الملاحة, المادة الرئيسية, الشريط الجانبي أو تذييل الصفحة.ولكن المجلة أقسام مختلفة--الاقتصاد, الرياضة, الترفيه.تريد ثلاثة أقسام قد تبدو مختلفة--الاقتصاد المحافظة ساحة العمل الرياضي-y, تسلية مشرق و الشباب.

يمكنك استخدام فئات لهذا.كنت لا تريد أن تجعل الهويات المتعددة.#الاقتصاد-المادة و #الرياضة-المادة و #الترفيه-المادة.هذا لا معنى له.بدلا من ذلك, يمكنك تحديد ثلاثة فصول .الاقتصاد والرياضة .الترفيه ، ثم تحديد #nav, #المادة ، #تذييل معرفات لكل منها.

.sectionA[id='content'] { color : red; }

ولن تعمل عند نوع المستند هو أتش تي أم أل 4.01 الرغم من ...

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top