zoukankan      html  css  js  c++  java
  • 制作通用模块标题

    简单模块标题一般有文字和图片两种方式,文字除了标题还可以加更多链接,利用common.less可以把样式共用,每开发一次模板,只要把这标题做一次就可以了,非常方便。

     <group title="模块标题">
                <section title="标题设置" folded="false">
                    <param description="" formType="range" label="标题显示模式:" name="title_module" ptype="text">
                       <option value="1" selected="selected">文字模式</option>
                      <option value="2">自定义图片模式</option>
                                     <option value="0">×不显示</option>
                     </param>
                </section>
                <section title="文字模式" folded="false">
                    <param description="" formType="text" label="标题文字:" name="title" ptype="text">分类推荐</param>
                    <param description="" formType="text" label="更多文字:" name="title_more" ptype="text">more+</param>
                    <param description="" formType="text" label="更多链接:" name="more_link" ptype="text">#</param>
                </section>
                <section title="自定义图片模式" folded="false">
                    <param description="宽度950,高度不限" formType="text" label="图片地址:" name="title_img" ptype="text"></param>
                </section>
            </group>

    common.less

    .title1{
    height:30px;line-height:30px;padding-left:14px;font-size:14px;overflow:hidden;position:relative;background:#e4e3e8;margin-bottom:10px;
    .more{position:absolute;right:10px;display:block;line-height:30px;top:0;color:#000;text-decoration:none;}
    }

    对应模块内css

    .moduletitle{.title1;}

    PHP代码:

    //模块标题
    $title_module= $_MODULE['title_module'];        //标题模式
    $title= $_MODULE['title'];                        //标题文字
    $title_more =$_MODULE['title_more'];            //更多文字
    $more_link=$_MODULE['more_link'];                //更多链接
    $title_img=$_MODULE['title_img'];              //自定义图片
    
    
    if($title_module==1){
            //文字模式
            echo '<div class="moduletitle">'.$title.'<a class="more" href="'.$more_link.'">'.$title_more.'</a></div>';
        }elseif($title_module==2){
            //自定义图片模式
            $title_pic=$title_img ? $title_img : '../../assets/images/titlepic.jpg';
            echo '<div class="title_pic"><img src="'.$title_pic.'" /></div>';
        }else{
            //不显示
            echo '';
        }
  • 相关阅读:
    06 is和==的区别 encode()编码 decode()解码
    05 dic的增删改查 字典的嵌套 考试题dic.get()的相关使用
    03 编码 int ,bool,str的常用操作 主要讲str
    01 基本数据类型 变量 if语句
    04 列表的增删改查 常用方法 元祖 range
    02 while循环 格式化输出 运算符
    多校2 Harmonious Army hdu6598 网络流
    P3159 [CQOI2012]交换棋子 网络流
    P2172 [国家集训队]部落战争 最大流
    P2402 奶牛隐藏 网络流
  • 原文地址:https://www.cnblogs.com/tinyphp/p/4615634.html
Copyright © 2011-2022 走看看