CSS Message Box collection

21 04 2008

Bagi memudahkan kerja utk membuat css message box collection di sini sy ingin kongsikan ada beberapa style yang boleh digunakan. kebiasannya style ini di gunakan untuk membuat alert atau message. Dengan menggunakan style ini message atau alert akan kelihatan lebih menarik dan ramai yang digunakan oleh setiap orang dalam membuat web atau sistem. Di bawah ini ada beberapa contoh

Cara penggunaannya :

Code HTML :

<div class=“clean-gray”>Css message box</div>

Code Css

.clean-gray{

border:solid 1px #DEDEDE;
background:#EFEFEF;
color:#222222;
padding:4px;
text-align:center;

}

Klik di sini utk download

Sumber : woork

Css message style

Code html

<p class="alert">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>

Code Css
.alert {
	background: #fff6bf url(bioneural/exclamation.png) 15px center no-repeat;
	text-align: left;
	padding: 5px 20px 5px 45px;
	border-top: 2px solid #ffd324;
	border-bottom: 2px solid #ffd324;
	}

Hasilnya :

sumber : bioneural


Actions

Information

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s




%d bloggers like this: