DEDECMS V5.3 官方默认模板 预设列表样式说明

softyun3年前cms教程140

DEDECMS V5.3在(layout.css)中预设了6种区块列表样式
您可以根据自己的实际需要修改使用
下面以首页区块调用位置为例
我们来详细介绍这六种列表样式的结构和class
首页模板的<div class="listbox"></div>内是区块列表的调用
<dl class="tbox">
<dt><strong><a href="{dede:field name='typeurl'/}">{dede:field name='typename'/}</a></strong><span class="more"><a href="{dede:field name='typeurl'/}">更多...</a></span></dt>
<dd>
<ul class="d1 ico3">
{dede:arclist titlelen='60' row='8'}
<li><span class="date">[field:pubdate function="MyDate('m-d',@me)"/]</span><a href="[field:arcurl /]">[field:title /]</a></li>
{/dede:arclist}
</ul>
</dd>
</dl>
其中<dd></dd>区域即为列表调用
只需修改<ul>的class和内部<li>的结构即可更换列表调用样式
-------------------无聊的分隔线--------------------------------------------
列表调用样式1 - 纯文本列表(c1)
纯文本列表只调用标题,适合标题比较长的列表形式,长度约为26个中文字符.
<ul class="c1 ico3">
  {dede:arclist row='8'}
    <li><a href="[field:arcurl /]">[field:title /]</a></li>
  {/dede:arclist}
</ul>
列表调用样式2 - 带日期的长标题列表(d1)
可以调用23个中文字符的长标题和短日期
<ul class="d1 ico3">
  {dede:arclist row='8'}
    <li><span class="date">[field:pubdate function="MyDate('m-d',@me)"/]</span><a href="[field:arcurl /]">[field:title /]</a></li>
  {/dede:arclist}
</ul>
列表调用样式3 - 带日期的短标题列表(d2)
可以调用19个中文字符的长标题和短日期
<ul class="d2 ico3">
  {dede:arclist row='8'}
    <li><span class="date">[field:pubdate function="MyDate('Y-m-d',@me)"/]</span><a href="[field:arcurl /]">[field:title /]</a></li>
  {/dede:arclist}
</ul>
列表调用样式4 - 图文混排列表1(e5,c1)
左侧调用图片,右侧调用文字标题列表
<ul class="e5">
    {dede:arclist row='2' type='image'}
    <li><a href="[field:arcurl /]"><img src="[field:litpic _fcksavedurl=""[field:litpic" /]" /></a></li>
    {/dede:arclist}
</ul>
<ul class="c1 ico3">
  {dede:arclist row='6'}
    <li><a href="[field:arcurl /]">[field:title /]</a></li>
  {/dede:arclist}
</ul>
列表调用样式5 - 图文混排列表2(e6,d2)
上部调用图片,下部调用文字标题加长日期列表
<ul class="e6">
    {dede:arclist row='3'  type='image'}
    <li><a href="[field:arcurl /]"><img src="[field:litpic _fcksavedurl=""[field:litpic" /]" /></a></li>
    {/dede:arclist}
</ul>
<ul class="d2 ico3">
  {dede:arclist row='3'}
    <li><span class="date">[field:pubdate function="MyDate('Y-m-d',@me)"/]</span><a href="[field:arcurl /]">[field:title /]</a></li>
  {/dede:arclist}
</ul>
列表调用样式6 - 图文混排列表3(e6,c2)
上部调用图片,下部调用两列文字列表
<ul class="e6">
    {dede:arclist row='3'  type='image'}
    <li><a href="[field:arcurl /]"><img src="[field:litpic _fcksavedurl=""[field:litpic" /]" /></a></li>
    {/dede:arclist}
</ul>
<ul class="c2 ico3">
  {dede:arclist row='6'}
    <li><a href="[field:arcurl /]">[field:title /]</a></li>
  {/dede:arclist}
</ul>
另外ico部分有3种ico可选择
分别是:ico1:实心方块,ico2:实心箭头,ico3:描边箭头.
您也可以根据自己需要替换images目录下的ico文件或更改layout.css增加新的ico样式.
这些类型的列表样式可以应用在模板的首页区块列表调用,右侧列表调用及频道页区块列表调用.
另外layout.css中还包含了部分特殊类型的列表调用样式,有兴趣的朋友可以自行研究. 免责声明:本文内容来自用户上传并发布,站点仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。请核实广告和内容真实性,谨慎使用。

相关文章

DedeCms教程:投票模块插件使用说明

织梦内容管理系统投票插件伴随着DEDECMS的成长,变得越来越方便使用。在DedeCMSv5.7系统中,投票插件可以轻松插入到每一篇文档里,使用更加灵活。字体设计教程 一、投票插件的安装ExtJS...

DedeCMS教程:在列表页输出当前页码相关信息

本方法原理上适用于DedeV5.3及以上所有的版本,不分编码。 这个问题来源于刚才有一位朋友的需求,他希望在列表页可以自由的调用当前栏目的一些与页码相关的信息。这个需求如果用自带的织梦标签,是无法实...

织梦dedecms自定义表单获取IP地址和提交时间

今天教大家如何实现织梦dedecms自定义表单获取IP地址和提交时间小编在网上找了很多JS文件,但太繁琐了。后来小编注意到一个细节,每次登陆后台,织梦系统都会记录登陆时间和IP地址,这说明织梦自带IP...

DedeCms教程:优化DedeCMS搜索结果

由于DedeCMS搜索采用了分词,提升了搜索智能化,但是我们发现,搜索结果并没有变的更准确,本篇对DedeCMS的搜索进行一个优化,使它的搜索结果变的更智能、准确。首先需要调整搜索页面的一个栏目关键词...

让首页问答出现已经解决的问题

\templets\default\index模板中问答部分 {dede:ask row='8'}改为{dede:ask row='' qtype='ok'}官方原帖:40300&2...

更改data目录名称也可让dedecms更安全

现在最新的5.7版本和5.7SP1版本后台都有个安全检测,data目录如果使用默认的名称,那么系统的安全肯定会大打折扣。大家一定看到过这样的提示:强烈建议将data目录搬移到Web根目录以外;查看如何...