/Twitter Bootstrap Tutorial – Base CSS

Twitter Bootstrap Tutorial – Base CSS

النهارده ان شاء الله هنبتدي في جزئية ال base css لل bootstrap ،هو الموقع موضح فيها شويه اساسيات مثلا زي القيم او الاشكال الافتراضيه اللي بتاخدها بعض الtags اللي في ال html وهكذا ، المقال مش هيكون شرح اوي بقدر ما هيكون زي دليل بسيط لشوية حاجات

** ملحوظه : استخدمت هنا مباشرة الامثلة اللي مكتوبة في موقع البوتستراب كما هي

  1. Typography

**Heading :-

– جميع ال html heading من h1 الى h6 اقدر استخدمها وبتاخد افتراضيا الشكل ده ، لكن طبعا انا بقدر اغير ال style لان زي ما احنا عارفين ان الغرض من النوع ده من ال tags انها بتكون لتوضيح الاهميه مش بستخدمها لكبر او صغر الخط فيها بس

Base · Bootstrap

 ** Body and Paragraph :-

–  القيم الاساسيه لل Bootstrap font فبيكون font-size = 14 px و line-height = 20 px ودي بتكون القيم الاساسيه في ال <body> و <p> ده بالاضافه ان ال p بياخد margin bottom بنص قيمة ال lin-height بتاعه ، يعني 10 px

وممكن اخلي ال paragraph اكثر بروزا باستخدام ال class=”lead”

-: Emphasis**

ودي ال tags اللي زي :

<small> : make font smaller

<strong> : bold effect

<em> : italic

وطبعا مع html5 ممكن تستخدم

<b> :  highlight words or phrases without conveying additional importance

<i> : for voice, technical terms, etc.

**Alignment Classes :-

<p class=”text-left”> : يعني ان الباراجراف ده بمحاذاه ناحية الشمال

class=”text-center” : محاذاه في النص

class=”text-right” : محاذاه ناحية اليمين

**Emphasis classes:-

ميزة الكلاسز دي انها برضه مش مجرد انها بتديك style للكلام ، بل بتديله كمان اهمية وتركيز عن اي كلام عادي مش منسوب اليها ، وبتستخدم الكلاس المناسبة مع الكلام المناسب ليها

 Base · Bootstrap - em

**Addresses:-

بستخدمها لاظهار العناوين بشكل مرتب مباشرة ، بدل ما اعمل انا الستايل ده من اول

Base · Bootstrap - add

**Blockquotes :-

ودي برضه حاجه تانيه بيقدمها ال bootstrap جاهزة ، في حالة اذا احتوى الموقع بتاعك على quotes او ما يشابهها في طريقة الكتابه ، ساعتها بتستخدم <blockquote> علطول وهو بيظبطه بالشكل ده

بتستخدم معاها الكلاس pull-right لو انت حابب انها تبتدي م اليمين -مثلا اذا كانت عربي- ، وممكن برضه تستخدم جواها <small> زي ما هم موضحين انه مثلا لكتابه اسم الكاتب او ما شابه

Base · Bootstrap - q

 

**Lists :-

 

فاول نوع ال Unordered هي ال list اللي مش هاممني فيها الترتيب اوي ، فممكن بقى يكون قبل كل عنصر فيها نقطه مثلا او مربع او شكل معين او ممكن اختار انها تكون من غير اي حاجه ، لكن ال Ordered بيكون مهم الترتيب لذلك بتكون مرقمه بارقام.

ال description بقى بتكون list العناصر فيها عبارة عن عناوين اساسيه ولكل عنوان وصف معين يتبعه ، وبيتميز الاتنين دول عن بعض

بكده نكون خلصنا ال typography ولنا في البقية لقاء في المقال القادم ان شاء الله .. تحياتي

Faculty of Engineering, Computer and Control Systems Department, Mansoura University - 2014