Post on 13-Jan-2015
description
CSS3 Introduction
CSS3 is the latest standard for CSS
CSS3 Modules
SelectorsBox ModelBackgrounds and BordersImage Values and Replaced ContentText Effects2D/3D TransformationsAnimationsMultiple Column LayoutUser Interface
Border<!DOCTYPE html><html><head><style>div{border:2px solid #a1a1a1;padding:10px 40px;background:#01a05f;width:300px;border-radius:25px;}</style></head><body>
<div>Borderku.</div>
</body></html>
Selector Sample<!DOCTYPE html><html><head><style>[title]{color:blue;}</style></head>
<body><h2>Selamat:</h2><h1 title="Datang !">Datang !</h1>
<hr><h2>Bandingkan:</h2><p>Selamat Datang !</p></body></html>
Text Effect<!DOCTYPE html><html><head><style>h1{text-shadow: 10px 10px 10px #ff6b4f;}</style></head><body>
<h1>Jogja Istimewa Bro !</h1>
</body></html>
Sample Menu
<!DOCTYPE html><html><head><style>ul{list-style-type:none;margin:0;padding:0;overflow:hidden;}li{float:left;}a:link,a:visited{
display:block;width:120px;font-weight:bold;color:#FFFFFF;background-color:#98bf21;text-align:center;padding:4px;text-decoration:none;text-transform:uppercase;}a:hover,a:active{background-color:#7A991A;}
</style></head>
<body><ul><li><a href="#home">Home</a></li><li><a href="#news">Berita</a></li><li><a href="#contact">Gallery</a></li><li><a href="#about">Kontak</a></li></ul></body></html>
CSS3 Create Multiple Columns
<style>.newspaper{-moz-column-count:3; /* Firefox */-webkit-column-count:3; /* Safari and Chrome */column-count:3;
-moz-column-gap:40px; /* Firefox */-webkit-column-gap:40px; /* Safari and Chrome */column-gap:40px;}</style></head><body>
<h1> STMIK AMIKOM </h1><div class="newspaper">Yogyakarta is the only one of the Indonesian, special-territory provinces which has been known as thecenters for education in Indonesia and for Javanese culture. STMIK Amikom Yogyakarta is located inthe center of Yogyakarta city and in the distance of four kilometers from “Adisucipto” internationalairport, which lies in the eastern part of Yogyakarta, Indonesia. STMIK AMIKOM students are not onlyfrom many different places in Indonesia but from abroad as well..</div>
• Thanks
http://www.gratisan.comhttp://www.jogjawebcenter.com