css标题制作

使用CSS制作标题的方法

基础样式设置 通过font-size、font-weight和color属性快速定义标题外观：

h1 {
  font-size: 2.5rem;
  font-weight: 700;
  color: #333;
}

添加装饰效果 使用text-shadow创建立体效果或border-bottom添加下划线：

h2 {
  text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
  border-bottom: 2px solid #eee;
  padding-bottom: 8px;
}

响应式标题设计 通过媒体查询适配不同设备：

h3 {
  font-size: 1.8rem;
}
@media (max-width: 768px) {
  h3 {
    font-size: 1.4rem;
  }
}

创意文字效果 结合背景渐变和background-clip实现特殊效果：

h4 {
  background: linear-gradient(to right, #ff8a00, #e52e71);
  -webkit-background-clip: text;
  color: transparent;
}

动画标题 添加悬停动画增强交互性：

h5 {
  transition: transform 0.3s;
}
h5:hover {
  transform: scale(1.05);
}

伪元素装饰 使用::before或::after添加装饰元素：

h6::before {
  content: "◆";
  margin-right: 10px;
  color: #4CAF50;
}