• افکت Underline برای لینک ها
    #1
    Note 
    سلام دوستان
    امروز یه ترفند جالب میخوام براتون بذارم که میتونید برای نمایش Underline در لینک ها یک افکت جالب ایجاد کنید.

    کافیه از این کد CSS استفاده کنید:
    [CSS]a {
    display: inline-block;
    position: relative;
    padding-bottom: 3px;
    text-decoration: none;
    font:800 15px arial;
    }
    a:after {
    content: '';
    display: block;
    margin: auto;
    height: 3px;
    width: 0px;
    background: transparent;
    transition: width .4s ease, background-color .4s ease;
    }
    a:hover:after {
    width: 100%;
    background: blue;
    }[/CSS]

    و کد HTML:
    [HTML]<a href="http://softafzar.net">SOFTAFZAR.NET</a>[/HTML]

    دمو: Edit fiddle - JSFiddle
    ازاین افکت برای لینکها در قسمت لیست تگهای HTML هم استفاده شده.
    موفق باشید.

    پاسخ
    #2
    Note 
    واقعا عالی و زیباست ممنون
    راستی قسمت لیست تگهای HTML رو من تا به حال ندیده بودم! خیلی خوب شده!

    پاسخ
    ایجاد موضوع جدید   پاسخ به موضوع  

    کاربرانِ درحال بازدید از این موضوع:   1 مهمان