الفرق بين المراجعتين ل"CSS/:first"
< CSS
اذهب إلى التنقل
اذهب إلى البحث
ط (استبدال النص - '\[\[تصنيف:(.*)\]\]' ب'{{SUBPAGENAME}}') |
|||
| سطر 53: | سطر 53: | ||
*مواصفة [https://drafts.csswg.org/css-page-3/#left-right-first CSS Paged Media Module Level 3]. | *مواصفة [https://drafts.csswg.org/css-page-3/#left-right-first CSS Paged Media Module Level 3]. | ||
*مواصفة [http://www.w3.org/TR/CSS2/page.html#page-selectors CSS Level 2 (Revision 1)]. | *مواصفة [http://www.w3.org/TR/CSS2/page.html#page-selectors CSS Level 2 (Revision 1)]. | ||
| − | [[تصنيف:CSS]] | + | [[تصنيف:CSS|{{SUBPAGENAME}}]] |
| − | [[تصنيف:CSS Selectors]] | + | [[تصنيف:CSS Selectors|{{SUBPAGENAME}}]] |
| − | [[تصنيف:CSS pseudo-class]] | + | [[تصنيف:CSS pseudo-class|{{SUBPAGENAME}}]] |
مراجعة 15:36، 28 يناير 2018
الصنف الزائف :first في CSS (أي pseudo-class) يُستعمَل مع القاعدة @page، ويُمثِّل أوّل صفحة من المستند عند طباعته.
@page :first {
margin-left: 50%;
margin-top: 50%;
}
ملاحظة: لا يمكن تغيير قيم جميع خاصيات CSS عند استخدام هذا الصنف الزائف، وإنما يمكن تغيير قيم الهوامش margin واليتامى orphans والأرامل widows وطريقة الانتقال إلى صفحة جديدة؛ وسيتم تجاهل جميع الخاصيات الأخرى.
الشكل العام لهذا المحدد:
:first
أمثلة
لاحظ كيف ستتغير الهوامش في الصفحة الأولى عند طباعتها:
<p>First Page.</p>
<p>Second Page.</p>
<button>Print!</button>
شيفرة CSS:
@page :first {
margin-left: 50%;
margin-top: 50%;
}
p {
page-break-after: always;
}
شيفرة JavaScript:
document.querySelector("button").onclick = function () {
window.print();
}
دعم المتصفحات
| الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| الدعم الأساسي | مدعومة | غير مدعومة | 8.0 | 9.2 | ؟ |
مصادر ومواصفات
- مواصفة CSS Paged Media Module Level 3.
- مواصفة CSS Level 2 (Revision 1).