HTML5+CSS、CSS3基础知识点总结

CSS3是CSS技术的一个扩展，它提供了更加丰富和强大的样式功能，比如阴影、渐变、变换等。以下是一些CSS3的基础知识点和示例代码：

1. 圆角（border-radius）:

div {
  border: 2px solid #000;
  border-radius: 10px; /* 所有角都有相同的圆角 */
}

2. 阴影（box-shadow）:

div {
  box-shadow: 10px 10px 5px #888888; /* 水平偏移 垂直偏移 模糊半径 颜色 */
}

3. 线性渐变（linear-gradient）:

div {
  background: linear-gradient(to right, red, yellow);
}

4. 旋转（transform: rotate）:

div {
  transform: rotate(45deg); /* 旋转45度 */
}

5. 转换（transform）: 可以包含多个功能，如旋转、缩放、移动等。

div {
  transform: rotate(45deg) scale(1.5) translate(100px, 100px);
}

6. 过渡（transition）: 添加动画效果，使得CSS属性变化时更平滑。

div:hover {
  width: 200px;
  transition: width 0.5s ease-in-out;
}

7. 用户界面（UI）属性: 如 resize、box-sizing 等。

textarea {
  resize: none; /* 禁止文本域的调整大小 */
}
 
div {
  box-sizing: border-box; /* 使元素的宽度和高度包括了内边距和边框 */
}

这些是CSS3的基础知识点，实际应用中可以根据需要结合HTML5使用。CSS3提供了更多复杂的动画和效果，需要在实践中逐渐掌握和应用。