css制作div
创建基本 div 结构
在 HTML 文件中添加一个 div 元素，并为其指定一个类名或 ID 以便于 CSS 选择器定位：
<div class="example-div">这是一个 div 元素</div>设置 div 样式
通过 CSS 为 div 添加基础样式，包括宽度、高度、背景色等：
.example-div {
width: 200px;
height: 100px;
background-color: #f0f0f0;
border: 1px solid #ccc;
}控制 div 布局
使用 CSS 布局属性调整 div 的位置和排列方式：
.example-div {
margin: 10px auto; /* 水平居中 */
padding: 15px;
display: block; /* 默认值，可改为 flex/inline-block 等 */
}添加交互效果
通过伪类和过渡效果增强交互性：
.example-div:hover {
background-color: #e0e0e0;
transform: scale(1.05);
transition: all 0.3s ease;
}响应式设计
使用媒体查询使 div 适应不同屏幕尺寸：
@media (max-width: 600px) {
.example-div {
width: 90%;
height: auto;
}
}进阶样式示例
组合使用阴影、圆角等现代 CSS 特性：
.example-div {
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
border-radius: 8px;
font-family: 'Arial', sans-serif;
text-align: center;
line-height: 100px;
}
