CSS3是一種比CSS2更強大和靈活的樣式表語言，它可以實現更多的效果和布局，讓網頁變得更加生動和美觀。

/* CSS3模板 */
html {
height: 100%;
}
body {
margin: 0;
padding: 0;
background-color: #f0f0f0;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
line-height: 1.5;
height: 100%;
}
.container {
width: 80%;
margin: 0 auto;
padding: 20px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
/* 頁面布局 */
.header {
height: 80px;
background-color: #333;
color: #fff;
text-align: center;
line-height: 80px;
}
.main {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.sidebar {
width: 25%;
height: 500px;
background-color: #cfcfcf;
margin-right: 20px;
}
.content {
width: 70%;
height: 500px;
background-color: #ebebeb;
}
/* 響應式布局 */
@media screen and (max-width: 768px) {
.container {
width: 90%;
}
.main {
flex-direction: column;
}
.sidebar {
width: 100%;
margin-right: 0;
margin-bottom: 20px;
height: auto;
}
.content {
width: 100%;
height: auto;
}
}
/* 動畫效果 */
.button {
display: inline-block;
padding: 10px 20px;
background-color: #333;
color: #fff;
border-radius: 3px;
transition: all 0.3s ease-in-out;
}
.button:hover {
background-color: #fff;
color: #333;
}

以上是一份簡單的CSS3模板，包含基本的頁面布局和響應式設計，以及一些簡單的動畫效果，可供參考和學習。