کاربر:Admin/صفحه تمرین

از ویکی‌کد، دانشنامهٔ برنامه‌نویسی
پرش به ناوبری پرش به جستجو

مثال بوت استرپ ۴

<div class="jumbotron text-center">
  <h1>My First Bootstrap Page</h1>
  <p>Resize this responsive page to see the effect!</p>
</div>

<div class="container">
  <div class="row">
    <div class="col-sm-4">
      <h3>Column 1</h3>
      <p>Lorem ipsum dolor..</p>
    </div>
    <div class="col-sm-4">
      <h3>Column 2</h3>
      <p>Lorem ipsum dolor..</p>
    </div>
    <div class="col-sm-4">
      <h3>Column 3</h3>
      <p>Lorem ipsum dolor..</p>
    </div>
  </div>
</div>


Internet Explorer / Edge Chrome Firefox Safari Opera
<!--...--> بله بله بله بله بله
<!--...--> بله بله بله بله بله
<!--...--> بله بله بله بله بله
<!--...--> بله بله بله بله بله
<!--...--> بله بله بله بله بله

<!DOCTYPE html> Bootstrap Example


Sticky Navbar

A sticky navigation bar stays fixed at the top of the page when you scroll past it.

Scroll this page to see the effect. Note: sticky-top does not work in IE11 and earlier.


Some example text. Some example text. Some example text. Some example text. Some example text.

Some example text. Some example text. Some example text. Some example text. Some example text.

Some example text. Some example text. Some example text. Some example text. Some example text.

Some example text. Some example text. Some example text. Some example text. Some example text.



Try to scroll inside this frame to understand how sticky positioning works.

Note: IE/Edge 15 and earlier versions do not support sticky position.

I am sticky!

In this example, the sticky element sticks to the top of the page (top: 0), when you reach its scroll position.

Scroll back up to remove the stickyness.

Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.

Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus.

position: fixed;

An element with position: fixed; is positioned relative to the viewport, which means it always stays in the same place even if the page is scrolled:

This <div> element has position: fixed;

مقدار توضیحات شروع کنید فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En
Parametr توضیحات شروع کنید » فارسی En En En

<!DOCTYPE html> Bootstrap Example

Button Styles


<!DOCTYPE html> Bootstrap Example


Bottom Fixed Navbar

A fixed navigation bar stays visible in a fixed position (top or bottom) independent of the page scroll.

Scroll this page to see the effect