Css大全實例

以下是一些CSS大全的實例:

1. 基本的CSS樣式:

```css

body {

background-color: #f0f0f0;

font-family: Arial, sans-serif;

}

h1 {

color: #333;

text-align: center;

}

p {

color: #666;

font-size: 16px;

}

```

2. 文本陰影:

```css

h1 {

text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);

}

```

3. 框線圓角:

```css

div {

border-radius: 10px;

}

```

4. 漸變背景:

```css

div {

width: 300px;

height: 200px;

background: linear-gradient(to right, red, orange);

}

```

5. 回響式布局:

使用媒體查詢可以實現回響式布局,例如:

```css

@media screen and (max-width: 768px) {

body {

background-color: #fff;

}

}

```

6. 動畫效果:

使用CSS動畫可以使元素產生動態效果,例如:

```css

@keyframes myAnimation {

0% {background-color: red;}

50% {background-color: yellow;}

100% {background-color: green;}

}

div {

animation-name: myAnimation;

animation-duration: 4s;

}

```

以上只是CSS的一些基本用法和示例,CSS的功能非常強大,可以用於實現各種複雜的樣式和布局。建議查閱更多CSS教程和文檔以深入了解其用法。

以上就是【Css大全實例】的相關內容,敬請閱讀。