好看的标题样式
时间: 2023-07-24 19:16:32 浏览: 54
以下是一些好看的HTML标题样式,你可以根据自己的需要进行选择和修改:
1. 细线条标题:
```css
h1 {
font-size: 40px;
font-weight: 400;
text-transform: uppercase;
letter-spacing: 4px;
border-bottom: 1px solid #ccc;
padding-bottom: 10px;
margin-bottom: 20px;
}
```
2. 渐变色标题:
```css
h1 {
font-size: 48px;
font-weight: bold;
background: linear-gradient(to right, #ff5f6d, #ffc371);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
```
3. 大胆标题:
```css
h1 {
font-size: 60px;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 4px;
color: #333;
text-shadow: 2px 2px #ccc;
}
```
4. 创意标题:
```css
h1 {
font-size: 60px;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 4px;
color: #333;
position: relative;
}
h1:after {
content: '';
position: absolute;
bottom: -10px;
left: 50%;
transform: translateX(-50%);
width: 50px;
height: 5px;
background-color: #333;
border-radius: 10px;
}
```
5. 手写标题:
```css
h1 {
font-size: 60px;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 4px;
color: #333;
background: url('handwriting.png') repeat;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
```
以上只是一些示例,你可以根据自己的创意和喜好来设计自己的HTML标题样式。