في هذه المقالة ، سنقوم بإنشاء معلومات عمود للرجوع إليها. المحتوى المحدد كما يلي
يجب تحميل وتنفيذ ترتيب Google Chrome
$ (window) .Load (function () {$ ('. text'). eq (0) .css ('margin -top' ، ($ ('. auto').ملاحظة: بالنسبة لمتصفح Firefox ، يمكنك الضغط على Ctrl+Shift+M لضبط حجم محطة الجوال.
سؤال العنوان الفرعي
<div> <viv> <hgroup> <h1> المعلومات </h1> <h4> آخر الأخبار والموارد ، إلخ
العمود CSS
.jumbotron {margin: 50px 0 0 ؛ الحشو: 60px 0 ؛ الخلفية: #CCC url (../ IMG/BG.JPG) ؛ اللون: #ccc ؛}. Jumbotron H1 {font-size: 26px ؛ // 768،30 ؛ 992،33 ؛ 1200،36 ؛ Padding: 0 0 0 20px ؛}. Jumbotron H4 {font-size: 16px ؛ // 768،16 ؛ 992،17 ؛ 1200،18 Padding: 0 0 0 20px ؛}محتوى المعلومات
<div id = "information"> <viv> <viv> <viv> <viv> <viv> <viv> <viv> <viv> <img src = "img/info1.jpg"> </div> <viv> <h4> إدارة الحالة للراديو والسينما والتلفزيون تم إصدارها tvos2.0 و huawei aliba. تكامل TVOS1.0 ، Huawei MediaOs و Alibaba Yunos. تعد Huawei مسؤولة بشكل أساسي عن أعمال التنمية ، وأبابا مسؤولة عن مركز التسوق التلفزيوني المدمج. </p> <p> admin 15/10/11 </p> </viv> </viv> </viv> </viv> </viv> <viv> <lockquote> <h2> الأخبار الشائعة </h2> </blockquote> <viv> <viv> <viv> <viv> <viv> <div </viv> <div style = "padding-right: 0"> <h4> العنوان </h4> <p> admin 15/10/11 </p> </fiv> </viv> </viv> </viv> </viv> </viv> </viv> </viv> </viv> </viv> </viv>
محتوى المعلومات CSS
#Information {padding: 40px 0 ؛ الخلفية: #EEE ؛}. info-right {background-color: #ffff ؛ box-shadow: 2px 2px 3px #cc ؛}. Info-right blockquote {padding: 0 ؛ الهامش: 0 ؛}. info-right h2 {font-size: 20px ؛ padding: 5px ؛}. info-right h4 {line-height: 1.6 ؛}. info-content {background-color: #ffff ؛ box-shadow: 2px 2px 3px #ccc ؛ الهامش: 0 0 20px 0 ؛}. info-content img {margin: 12px 0 ؛}. info-content h4 {font-size: 14px ؛ // 768،16 ؛ 992،18 ؛ 1200،20 ؛ Padding: 2px 0 0 0 ؛}. Info-Content P {Line-Height: 1.6 ؛ اللون: #666 ؛}لـ .info-content H4 ، مطلوب خط واحد للشاشات المتوسطة والكبيرة.
.info-content H4 {overflow: Hidden ؛ الفضاء الأبيض: Nowrap ؛ Text-Overflow: ellipsis ؛}إذا كنت لا تزال ترغب في الدراسة بعمق ، فيمكنك النقر هنا لدراسة وتوصيل 3 موضوعات مثيرة لك:
Bootstrap التعلم البرنامج التعليمي
Bootstrap البرنامج التعليمي العملي
تعليمي استخدام المكونات الإضافية Bootstrap
ما ورد أعلاه هو الرمز الذي أرغب في إغلاق محتوى المعلومات من نظام الإنتاج الفرعي لإنتاج Bootstrap. أتمنى أن يحبها الجميع.