الفرق بين المراجعتين لصفحة: «Bootstrap/visibility»
إضافة محتوى الصفحة |
لا ملخص تعديل |
||
سطر 2: | سطر 2: | ||
تحكَّم في قابليّة الرؤية دون التعديل على قيمة الخاصيّة <code>display</code> باستخدام أدوات الرؤية المتوفّرة في إطار العمل Bootstrap. | تحكَّم في قابليّة الرؤية دون التعديل على قيمة الخاصيّة <code>display</code> باستخدام أدوات الرؤية المتوفّرة في إطار العمل Bootstrap. | ||
تعدِّل أدوات الرؤية (<code>visibility</code>) قابليّة رؤية العناصر. لا تؤثّر هذه الأدوات أبدًا على الخاصيّة <code>display</code>، وهي مفيدة لإخفاء المحتوى عن أغلب الزوّار مع توفيره لقارئات الشاشة. | تعدِّل أدوات الرؤية (<code>[[CSS/visibility|visibility]]</code>) قابليّة رؤية العناصر. لا تؤثّر هذه الأدوات أبدًا على الخاصيّة <code>display</code>، وهي مفيدة لإخفاء المحتوى عن أغلب الزوّار مع توفيره لقارئات الشاشة. | ||
طبِّق الصنف <code>.visible</code> أو <code>.invisible</code> حسب الحاجة.<syntaxhighlight lang="html"> | طبِّق الصنف <code>.visible</code> أو <code>.invisible</code> حسب الحاجة.<syntaxhighlight lang="html"> | ||
<div class="visible">...</div> | <div class="visible">...</div> | ||
<div class="invisible">...</div> | <div class="invisible">...</div> | ||
</syntaxhighlight><syntaxhighlight lang=" | </syntaxhighlight><syntaxhighlight lang="sass"> | ||
// صنف | // صنف | ||
.visible { | .visible { |
مراجعة 03:15، 15 أبريل 2018
تحكَّم في قابليّة الرؤية دون التعديل على قيمة الخاصيّة display
باستخدام أدوات الرؤية المتوفّرة في إطار العمل Bootstrap.
تعدِّل أدوات الرؤية (visibility
) قابليّة رؤية العناصر. لا تؤثّر هذه الأدوات أبدًا على الخاصيّة display
، وهي مفيدة لإخفاء المحتوى عن أغلب الزوّار مع توفيره لقارئات الشاشة.
طبِّق الصنف .visible
أو .invisible
حسب الحاجة.
<div class="visible">...</div>
<div class="invisible">...</div>
// صنف
.visible {
visibility: visible;
}
.invisible {
visibility: hidden;
}
// استخدام المخلوط
.element {
@include invisible(visible);
}
.element {
@include invisible(hidden);
}