ایجاد hero unit در نوار هدایتی

hero unit  به قسمتی می گویند که شامل یک عکس بزرگ به همراه یک مطلب مهم است . ما در این مقاله 

قصد داریم این قسمت را بسازیم . توجه داشته باشید که این مقاله در واقع ادامه ی مقاله ی 

ایجاد نوار هدایتی با منو های کرکره ای  می باشد . 

خب در مقاله ی قبلی یاد گرفتیم که چطور یک منو کرکره ای بسازیم . اکنون می خواهیم قسمت hero unit را بسازیم . 

برای ساخت قسمت hero unit باید اولا بدانید که هرچه که محتوای سایت ما را تشکیل می دهد باید درون دایو container

باشد . پس مثل تصویر زیر باید کدهای قسمت hero unit را  در زیر کدهای منو وارد کنید : 

Title

همان طور که در عکس بالا می بینید ابتدا یک دایو ایجاد می کنیم  و نام کلاس آن را hero-unit  می گذاریم . 

سپس یک تگ h1  ایجاد کرده  و سرفصل خود را در آن می نویسیم . و سپس یک پاراگراف ایجاد کرده کرده و توضیحی می نویسیم . 

<div class="hero-unit">
  <h1>مطالب مهم</h1>
  <p>در این قسمت مطالب مهم قرار می گیرند</p>
</div>

حالا برای اینکه یک دکمه ایجاد کنیم  یک تگ پاراگراف دیگر را ایجاد می کنیم  و درون این تگ یک تگ a  ایجاد می کنیم  و از کلاس های 

btn  و btn-primary   و btn-large استفاده می کنیم . 

<div class="hero-unit">
  <h1>مطالب مهم</h1>
  <p>در این قسمت مطالب مهم قرار می گیرند</p>
   <p><a class="btn btn-primary btn-large"></a></p>
</div>

 تا اینجا نتیجه بصورت زیر در خواهد آمد : 

Title

• قبلی
• بعدی