نمونه سفارش تراز لیست آشیانه متن یادداشت آیکون یادداشت نشان کشویی برچسب ها چک باکس رادیو

ساده

pic1

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

<!-- Simple -->
<div class="media">
    <img class="rounded" src="assets/img/90x90.jpg" alt="pic1">
    <div class="media-body">
        <h4 class="media-heading">Heading</h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

سفارش

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

pic1 
<!-- Order -->
<div class="media">
    <div class="media-body">
        <h4 class="media-heading">Heading</h4>
        <p class="media-text">
            لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است
        </p>
    </div>
    <img class="rounded" src="assets/img/90x90.jpg" alt="pic1">
</div>

رسانه های سطح بالا

pic1

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

<!-- Top Aligned Media -->
<div class="media">
    <img class="rounded" src="assets/img/90x90.jpg" alt="pic1">
    <div class="media-body">
        <h4 class="media-heading">Heading</h4>
        <p class="media-text"> لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

رسانه های همسایه

pic1

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

<!-- Center Aligned Media -->
<div class="media">
    <img class="align-self-center rounded" src="assets/img/90x90.jpg" alt="pic1">
    <div class="media-body">
        <h4 class="media-heading">Heading</h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

رسانه های هم تراز پایین

pic1

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

<!-- Bottom Aligned Media -->
<div class="media">
    <img class="align-self-end rounded" src="assets/img/90x90.jpg" alt="pic1">
    <div class="media-body">
        <h4 class="media-heading">Heading</h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

درست تراز شده

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

pic1 
<!-- Right Aligned -->
<div class="media">
    <div class="media-body text-right">
        <h4 class="media-heading">Heading</h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
    <img class="rounded" src="assets/img/90x90.jpg" alt="pic1">
</div>

لیست رسانه

  • pic1

    سرفصل

    لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

  • pic1

    سرفصل

    لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

  • pic1

    سرفصل

    لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

<!-- Media List -->
<ul class="list-unstyled">
    <li class="media">
        <img class="rounded" src="assets/img/90x90.jpg" alt="pic1">
        <div class="media-body">
            <h4 class="media-heading">Heading</h4>
            <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
        </div>
    </li>
    <li class="media">
        <img class="rounded" src="assets/img/90x90.jpg" alt="pic1">
        <div class="media-body">
            <h4 class="media-heading">Heading</h4>
            <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
        </div>
    </li>
    <li class="media">
        <img class="rounded" src="assets/img/90x90.jpg" alt="pic1">
        <div class="media-body">
            <h4 class="media-heading">Heading</h4>
            <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
        </div>
    </li>
</ul>

آشیانه

pic1

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

pic2

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

<!-- Nesting -->
<div class="media">
    <img class="meta-usr-img rounded" src="assets/img/90x90.jpg" alt="pic1">
    <div class="media-body">
        <h4 class="media-heading">Heading</h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>

        <div class="media">
            <a class="meta-usr-img" href="javascript:void(0);">
                <img class="rounded" src="assets/img/90x90.jpg" alt="pic2">
            </a>
            <div class="media-body">
                <h4 class="media-heading">Heading</h4>
                <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
            </div>
        </div>
    </div>
</div>

متن یادداشت

pic1

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

Reply Edit Delete 
<!-- Notation Text -->
<div class="media">
    <img class="rounded" src="assets/img/90x90.jpg" alt="pic1">
    <div class="media-body">
        <h4 class="media-heading">Heading</h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
        <div class="media-notation">
            <a href="javascript:void(0);" class=""> Reply </a>
            <a href="javascript:void(0);" class=""> Edit </a>
            <a href="javascript:void(0);" class=""> Delete </a>
        </div>
    </div>
</div>

یاداشت نمادین با نماد

pic1

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

Reply Edit Delete 
<!-- یاداشت نمادین با نماد -->
<div class="media">
    <img class=" rounded" src="assets/img/90x90.jpg" alt="pic1">
    <div class="media-body">
        <h4 class="media-heading">Heading</h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
        <div class="media-notation">
            <a href="javascript:void(0);" class=""><svg> ... </svg> Reply </a>
            <a href="javascript:void(0);" class=""><svg> ... </svg> Edit </a>
            <a href="javascript:void(0);" class=""><svg> ... </svg> Delete </a>
        </div>
    </div>
</div>

نشان

pic1

سرفصلطراح وب

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

<!-- Badge -->
<div class="media">
    <img class="rounded" src="assets/img/90x90.jpg" alt="pic1">
    <div class="media-body">
        <h4 class="media-heading"><span class="media-title"> Heading</span><span class="badge badge-primary">طراح وب</span></h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

لیست کشویی

pic1
سرفصل
Start chat Make a call Statistics

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

<!-- لیست کشویی -->
<div class="media">
    <img class=" rounded" src="assets/img/90x90.jpg" alt="pic1">
    <div class="media-body">
        <h4 class="media-heading"><span class="media-title"> Heading</span>
            <span class="dropdown-list dropdown">
                <i role="menu" class="flaticon-dot-three sr-only" id="dropdownMenuButton2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">sdfdsf</i>
                <svg> ... </svg>

              <span class="dropdown-menu" aria-labelledby="dropdownMenuButton2">
                <a class="dropdown-item" href="javascript:void(0);"><span>Start chat</span> <svg> ... </svg></a>
                <a class="dropdown-item" href="javascript:void(0);"><span>Make a call</span> <svg> ... </svg></a>
                <span class="dropdown-divider"></span>
                <a class="dropdown-item" href="javascript:void(0);"><span>Statistics</span> <svg> ... </svg></a>
              </span>
            </span>
        </h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

برچسب خورده

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

<!-- Label -->
<div class="media">
    <svg> ... </svg>
    <div class="media-body">
        <h4 class="media-heading"><span class="media-title"> Heading</span>
        </h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

<div class="media">
    <svg> ... </svg>
    <div class="media-body mb-2">
        <h4 class="media-heading"><span class="media-title"> Heading</span>
        </h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

چک باکس

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

<!-- Checkbox -->
<div class="media">
    <div class="n-chk">
        <label class="new-control new-checkbox checkbox-dark" style="height: 18px;">
          <input type="checkbox" class="new-control-input">
          <span class="new-control-indicator"></span>
        </label>
    </div>

    <div class="media-body">
        <h4 class="media-heading"><span class="media-title"> Heading</span>
        </h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

<div class="media">
    <div class="n-chk">
        <label class="new-control new-checkbox checkbox-dark" style="height: 18px;">
          <input type="checkbox" class="new-control-input" checked>
          <span class="new-control-indicator"></span>
        </label>
    </div>

    <div class="media-body">
        <h4 class="media-heading"><span class="media-title"> Heading</span>
        </h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

رادیو

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

سرفصل

لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است

<!-- Radio -->
<div class="media">
    <div class="n-chk">
        <label class="new-control new-radio radio-classic-dark" style="height: 18px;">
          <input type="radio" class="new-control-input" name="custom-radio-1">
          <span class="new-control-indicator"></span>
        </label>
    </div>

    <div class="media-body">
        <h4 class="media-heading"><span class="media-title"> Heading</span>
        </h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

<div class="media">
    <div class="n-chk">
        <label class="new-control new-radio radio-classic-dark" style="height: 18px;">
          <input type="radio" class="new-control-input" name="custom-radio-1" checked>
          <span class="new-control-indicator"></span>
        </label>
    </div>

    <div class="media-body">
        <h4 class="media-heading"><span class="media-title"> Heading</span>
        </h4>
        <p class="media-text">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
    </div>
</div>

© کپی رایت

بومی سازی شده توسط : طراح سفید