Loading data........
Tin nhanh :
Xem Tivi Online

Tổng hợp các kênh giải trí (Đang cập nhật chức năng..)

New Update

Truyền hình SCTV

SCTV14

SCTV15

SCTV16

SCTV17

SCTV18 HD

Vietnam Channels

VTV1

VTV2

VTV3

VTV4

VTV6

VTV9

VTC Online

VTC1

VTC2

VTC3

VTC4

VTC5

VTC6

VTC Online

VTC7

VTC8

VTC9

VTC10

VTC11

VTC12

Truyền hình tp HCM

HTV1

HTV2

HTV3

HTV4

HTV7

HTV9

Radio Channels

VOV1

VOV2

VOV3

VOV4

VOV5

VOV GT-HN

Home » » trang trí box hiển thị bằng css

trang trí box hiển thị bằng css

heading_demo

Xem DEMO

HTML code

<div id="container">     
        <h1> My Heading <span class="arrow"></span> </h1>        
</div>

CSS

#container {
    background: #666;
    margin: auto;
    width: 500px;
    height: 700px;
    padding-top: 30px;
    font-family: helvetica, arial, sans-serif;
    }

h1 {
     background: #e3e3e3;
     background: -moz-linear-gradient(top, #e3e3e3, #c8c8c8);
     background: -webkit-gradient(linear, left top, left bottom, from(#e3e3e3), to(#c8c8c8));
     padding: 10px 20px;
     margin-left: -20px;
     margin-top: 0;
     position: relative;
     width: 70%;

    -moz-box-shadow: 1px 1px 3px #292929;
    -webkit-box-shadow: 1px 1px 3px #292929;

    color: #454545;
    text-shadow: 0 1px 0 white;
}

.arrow {
     width: 0; height: 0;
     line-height: 0;
     border-left: 20px solid transparent;
     border-top: 10px solid #c8c8c8;
     top: 104%;
     left: 0;
     position: absolute;
}

Fixed trên IE ta ta thêm vào đoạn code dưới đây

<!--[if IE]>
        <style>
            .arrow { top: 100%; }
        </style>
<![endif]-->
Like và chia sẻ với bạn bè :

0 nhận xét:

Speak up your mind

Tell us what you're thinking... !

 
Proudly powered by Blogger
Copyright © 2009-. The Color Of Life - All Rights Reserved