制作 .css
创建 CSS 文件的基础步骤
新建一个纯文本文件，将文件扩展名改为 .css（例如 style.css）。文件内容需遵循 CSS 语法规则，包含选择器和声明块。
编写 CSS 语法结构
每个 CSS 规则由选择器和声明块组成。声明块包含属性和值，用花括号包裹：
选择器 {
属性: 值;
属性: 值;
}例如：
body {
font-family: Arial;
background-color: #f0f0f0;
}常用 CSS 属性示例
- 文本样式：
h1 { color: blue; text-align: center; font-size: 24px; } - 盒模型：
.box { width: 200px; padding: 20px; border: 1px solid black; margin: 10px; } - 布局（Flexbox）：
.container { display: flex; justify-content: space-between; }
链接 CSS 到 HTML
在 HTML 文件的 <head> 部分通过 <link> 标签引入 CSS 文件：
<link rel="stylesheet" href="style.css">使用开发者工具调试
浏览器开发者工具（F12）可实时检查 CSS 效果，修改属性值并预览。
优化与组织代码
-
使用注释分区块：
/* 全局样式 */ body { margin: 0; } /* 导航栏样式 */ nav { background: #333; } -
按功能拆分多个 CSS 文件（如
layout.css、theme.css），通过@import合并或分标签引入。
进阶技巧
- 变量（CSS 自定义属性）：
:root { --primary-color: #3498db; } button { background-color: var(--primary-color); } - 媒体查询实现响应式设计：
@media (max-width: 600px) { body { font-size: 14px; } }
