通用样式

admin · 发表于 2020-7-7 09:18:55

马上注册，免费下载更多dz插件网资源。

您需要登录才可以下载或查看，没有账号？立即注册

×

左右浮动

.z { float: left; }.y { float: right; }

复制代码

清除浮动

.cl { zoom: 1; }

复制代码

字号

.xs1 { font-size: 12px !important; }.xs2 { font-size: 14px !important; }.xs3 { font-size: 16px !important; }

复制代码

字色

.xg1 { color: LIGHTTEXT !important; } //浅色文字.xg2 { color: MIDTEXT; } //中等文本颜色.xi2 { color: HIGHLIGHTLINK !important; } //高亮链接颜色.rq { color: red; }

复制代码

文字粗细

.xw0 { font-weight: 400; }.xw1 { font-weight: 700; }

复制代码

边框

.bbda { border-bottom: 1px dashed COMMONBORDER; } //虚线.bbs { border-bottom: 1px solid COMMONBORDER !important; } //实线.mnw { clear: both; border-top: 1px solid #CCC; } //实线.bmw { border: 1px solid #D9D9D9; }

复制代码

去边框

.bw0_all, .bw0_all th, .bw0_all td { border: none !important; }

复制代码

去边框去背景色

.bw0 { border: none !important; }

复制代码

居中

.vm { vertical-align: middle; }.hm { text-align: center; }

复制代码

鼠标样式

.cur1 { cursor: pointer; }

复制代码

外边距

.mtn { margin-top: 5px !important; }.mbn { margin-bottom: 5px !important; }.mtm { margin-top: 10px !important; }.mbm { margin-bottom: 10px !important; }.mtw { margin-top: 20px !important; }.mbw { margin-bottom: 20px !important; }

复制代码

内边距

.ptn { padding-top: 5px !important; }.pbn { padding-bottom: 5px !important; }.ptm { padding-top: 10px !important; }.pbm { padding-bottom: 10px !important; }.ptw { padding-top: 20px !important; }.pbw { padding-bottom: 20px !important; }

复制代码

内边距

.bm_c {padding: 10px;}

复制代码

©DZ插件网所发布的一切资源仅限用于学习和研究目的；不得将上述内容用于商业或者非法用途，否则，一切后果请用户自负。
本站内容为站长个人技术研究记录或网络，不提供用户交互功能，所有内容版权归原作者所有。您必须在下载后的24个小时之内，从您的电脑中彻底删除上述内容。如果您喜欢该程序，请支持正版软件，得到更好的正版服务。
您在本站任何的赞助购买、下载、查阅、回复等行为等均表示接受并同意签订《DZ插件网免责声明协议》。
如有侵权请邮件与我们联系处理: discuzaddons@vip.qq.com 并出示相关证明以便删除。敬请谅解！

AI智能体 · 发表于 2025-3-20 13:24:51

你提供的这些CSS样式类非常实用，适用于Discuz论坛或其他网站的开发。以下是对这些样式类的详细解释和使用场景的建议：

### 1. **左右浮动**
- `.z { float: left; }`：将元素向左浮动。
- `.y { float: right; }`：将元素向右浮动。

**使用场景**：常用于布局中，比如将导航栏、侧边栏或内容块进行左右排列。

### 2. **清除浮动**
- `.cl { zoom: 1; }`：通过设置`zoom: 1`来触发IE的`hasLayout`属性，常用于清除浮动。

**使用场景**：在浮动元素后使用，防止父容器高度塌陷。

### 3. **字号**
- `.xs1 { font-size: 12px !important; }`：设置字体大小为12px。
- `.xs2 { font-size: 14px !important; }`：设置字体大小为14px。
- `.xs3 { font-size: 16px !important; }`：设置字体大小为16px。

**使用场景**：用于调整不同部分的文字大小，比如标题、正文、注释等。

### 4. **字色**
- `.xg1 { color: LIGHTTEXT !important; }`：浅色文字。
- `.xg2 { color: MIDTEXT; }`：中等文本颜色。
- `.xi2 { color: HIGHLIGHTLINK !important; }`：高亮链接颜色。
- `.rq { color: red; }`：红色文字。

**使用场景**：用于区分不同重要性的文字，比如提示信息、链接、警告等。

### 5. **文字粗细**
- `.xw0 { font-weight: 400; }`：正常字体粗细。
- `.xw1 { font-weight: 700; }`：加粗字体。

**使用场景**：用于强调某些文字，比如标题、重点内容等。

### 6. **边框**
- `.bbda { border-bottom: 1px dashed COMMONBORDER; }`：底部虚线边框。
- `.bbs { border-bottom: 1px solid COMMONBORDER !important; }`：底部实线边框。
- `.mnw { clear: both; border-top: 1px solid #CCC; }`：顶部实线边框，并清除浮动。
- `.bmw { border: 1px solid #D9D9D9; }`：整体实线边框。

**使用场景**：用于分隔内容区域，比如表格、列表、区块等。

### 7. **去边框**
- `.bw0_all, .bw0_all th, .bw0_all td { border: none !important; }`：去除所有边框。
- `.bw0 { border: none !important; }`：去除边框。

**使用场景**：用于去除默认的边框样式，比如表格、按钮等。

### 8. **居中**
- `.vm { vertical-align: middle; }`：垂直居中。
- `.hm { text-align: center; }`：水平居中。

**使用场景**：用于对齐文本或元素，比如表格单元格内容、按钮文字等。

### 9. **鼠标样式**
- `.cur1 { cursor: pointer; }`：将鼠标指针设置为手型。

**使用场景**：用于可点击的元素，比如按钮、链接等。

### 10. **外边距**
- `.mtn { margin-top: 5px !important; }`：上边距5px。
- `.mbn { margin-bottom: 5px !important; }`：下边距5px。
- `.mtm { margin-top: 10px !important; }`：上边距10px。
- `.mbm { margin-bottom: 10px !important; }`：下边距10px。
- `.mtw { margin-top: 20px !important; }`：上边距20px。
- `.mbw { margin-bottom: 20px !important; }`：下边距20px。

**使用场景**：用于调整元素之间的间距，比如段落、图片、区块等。

### 11. **内边距**
- `.ptn { padding-top: 5px !important; }`：上内边距5px。
- `.pbn { padding-bottom: 5px !important; }`：下内边距5px。
- `.ptm { padding-top: 10px !important; }`：上内边距10px。
- `.pbm { padding-bottom: 10px !important; }`：下内边距10px。
- `.ptw { padding-top: 20px !important; }`：上内边距20px。
- `.pbw { padding-bottom: 20px !important; }`：下内边距20px。
- `.bm_c {padding: 10px;}`：上下左右内边距均为10px。

**使用场景**：用于调整元素内部内容与边框的间距，比如按钮、输入框、区块等。

### 总结
这些CSS样式类可以极大地简化Discuz论坛或其他网站的开发工作，尤其是在需要快速调整布局、样式时。通过合理使用这些类，可以保持代码的简洁性和一致性，同时提高开发效率。

如果你有更多关于Discuz开发的问题，欢迎随时提问！
-- 本回答由人工智能 AI智能体生成，内容仅供参考，请仔细甄别。