Discuz! X 系统样式表 - 常用样式

admin · 发表于 2020-7-7 09:26:44

马上注册，免费下载更多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;}
.emp {padding: 20px 10px;}

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

Discuz智能体 · 发表于 2025-3-17 01:15:46

在Discuz! X系统中，样式表（CSS）是用于控制网站外观和布局的重要部分。以下是一些常用的样式类及其用途的详细解释：

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

### 2. **清除浮动**
- `.cl { zoom: 1; }`：用于清除浮动，防止父元素塌陷。

### 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; }`：设置字体粗细为400（正常）。
- `.xw1 { font-weight: 700; }`：设置字体粗细为700（加粗）。

### 6. **边框**
- `.bbda { border-bottom: 1px dashed COMMONBORDER; }`：设置底部边框为1px的虚线。
- `.bbs { border-bottom: 1px solid COMMONBORDER !important; }`：设置底部边框为1px的实线。
- `.mnw { clear: both; border-top: 1px solid #CCC; }`：清除浮动并设置顶部边框为1px的实线。
- `.bmw { border: 1px solid #D9D9D9; }`：设置1px的实线边框，颜色为#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。
- `.emp {padding: 20px 10px;}`：设置上下内边距为20px，左右内边距为10px。

这些样式类可以帮助你快速调整Discuz! X系统的页面布局和外观。你可以根据需要将这些类应用到HTML元素中，以实现所需的样式效果。如果你有更多关于Discuz! X系统的问题，欢迎继续提问！
-- 本回答由人工智能 AI智能体生成，内容仅供参考，请仔细甄别。

Discuz智能体 · 发表于 2025-3-21 03:34:56

在Discuz! X系统中，样式表（CSS）是用于控制网站外观和布局的重要部分。你提供的这些样式类是Discuz! X系统中常用的样式类，它们可以帮助你快速实现一些常见的布局和样式效果。以下是对这些样式类的详细解释和使用场景：

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

**使用场景**：当你需要将元素（如图片、文字块等）向左或向右对齐时，可以使用这两个类。

### 2. **清除浮动**
- `.cl { zoom: 1; }`：用于清除浮动，防止浮动元素影响后续元素的布局。

**使用场景**：在浮动元素后面添加一个带有`.cl`类的空元素，可以清除浮动，避免布局错乱。

### 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; }`：设置底部边框为1px虚线。
- `.bbs { border-bottom: 1px solid COMMONBORDER !important; }`：设置底部边框为1px实线。
- `.mnw { clear: both; border-top: 1px solid #CCC; }`：清除浮动并设置顶部边框为1px实线。
- `.bmw { border: 1px solid #D9D9D9; }`：设置1px实线边框。

**使用场景**：用于快速添加或调整元素的边框样式。

### 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。
- `.emp {padding: 20px 10px;}`：设置上下内边距为20px，左右内边距为10px。

**使用场景**：用于快速调整元素的内边距。

### 总结
这些样式类是Discuz! X系统中非常常用的工具类，可以帮助你快速实现各种布局和样式效果。通过合理使用这些类，你可以减少自定义CSS代码的编写，提高开发效率。

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