قرار دادن سه نقطه برای متن های طولانی در وب سایت

قرار دادن سه نقطه برای متن های طولانی در وب سایت

در طراحی وب سایت در بیشتر موارد این مشکل به وجود می آید که شما تعدادی باکس دارید که هم اندازه هستند و فقط یکی از این باکس ها نوشته هایش از بقیه بیشتر است. در این مواقع این مشکل پیش می آید  که نمای کلی وب سایت شما به دلیل اندازه بیش از حد همان باکس بهم میریزد.

برای رفع این مشکل می توان از css3 استفاده کرد.

کد زیر را در نظر بگیرید.

<div class="nowrap-cms">شرکت طراحی سایت cms iran</div>

حال css زیر را به کدهای css خود اضافه کنید.

.nowrap-cms{

white-space: nowrap;

overflow: hidden;

text-overflow: ellipsis;

}

1- به جای div تگ های دیگری هم می توانید به کار ببرید مانند h1,h2,h3,h4, ..,p,...

2- تگی که نوشته درون آن قرار می گیرد حتما باید width داشته باشد به طور مثال width:100px این کار برای آن است که اگر نوشته از 100px بیشتر شود به سه نقطه  محدود شود.

3- به تگی که در آن نوشته قرار دارد می توانید برای دیزاین  css های دلخواه خودتان را اضافه نمایید.