• 制作通用模块标题


    简单模块标题一般有文字和图片两种方式,文字除了标题还可以加更多链接,利用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 '';
        }
  • 相关阅读:
    Java可变参数
    为什么static方法中不可以调用非static方法
    用注解@DelcareParents实现引用增强
    在SpringBoot中用SpringAOP实现日志记录功能
    梳理一下我理解的aop
    包裹iframe的div与iframe存在高度差的问题解决方案
    非跨域情况下iframe 高度自适应的问题解决(一)
    flex布局较之float布局的优点新发现
    webpack4 动态导入文件 dynamic-import 报错的解决方法
    vue chrome 浏览器调试工具devtools插件安装
  • 原文地址:https://www.cnblogs.com/tinyphp/p/4615634.html
Copyright © 2020-2023  润新知