易居cms 首页更改资讯样式

最新推荐文章于 2021-06-29 10:51:22 发布
最新推荐文章于 2021-06-29 10:51:22 发布
阅读量228 收藏
点赞数
分类专栏： 随手笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/jjky8888/article/details/104491175
版权

找到相应位置 替换或新增代码：

<!--楼盘资讯-->
<div class="yv2News">
 <div class="w1200">
	      <div  class="index-tit">
          <h2>{$eju.region.name}导购资讯</h2>
          <p>热点文章&公告</p>
          {eju:type typeid='2' empty='栏目不存在时，显示这里的文案'}
          <a  class="more" target="_blank" href="{$field.typeurl}" title="{$field.typename}">查看更多</a>
          {/eju:type}
      </div>
    <div class="yv2News_center c">
	<div class="yv2News_mode">
        <div class="NewsMode_top">
          <p class="bg"><img src="" alt=""></p>
          <p class="text"> <i><img src="/template/default/pc/skin/img/ico_y1.png" alt=""></i> <span>楼盘动态</span> </p>
        </div>
        <div class="yv2News_list">
          <ul>
		  {eju:arclist typeid='4' orderby='new' row='6' id='field'}
          <li>
          <div class="tit"> <a target="_blank" href="{$field.arcurl}">{$field.title}</a> </div>
          <div class="mint_tu"> <a target="_blank" href="{$field.arcurl}" class="c">
          <p class="left_tu"><img src="{$field.litpic}" alt="{$field.title}"> </p>
          <p class="right_text"> <span>{$field.title}</span> <em>{$field.seo_description|html_msubstr=###,0,13,true}</em> </p>
          </a> </div>
          </li>
		  {/eju:arclist}
          </ul>
          <div class="gengduo">
		  {eju:type typeid='4' empty='栏目不存在时，显示这里的文案'}
		  <a href="{$field.typeurl}">
		  {/eju:type}
		  <img src="/template/default/pc/skin/img/v2ico_39.png" alt=""> </a> </div>
      
	  </div>
      </div>
            <div class="yv2News_mode">
        <div class="NewsMode_top">
          <p class="bg"><img src="" alt=""></p>
          <p class="text"> <i><img src="/template/default/pc/skin/img/ico_y2.png" alt=""></i> <span>购房指南</span> </p>
        </div>
        <div class="yv2News_list">
          <ul>
		  {eju:arclist typeid='5' orderby='new' row='6' id='field'}
          <li>
          <div class="tit"> <a target="_blank" href="{$field.arcurl}">{$field.title}</a> </div>
          <div class="mint_tu"> <a target="_blank" href="{$field.arcurl}" class="c">
          <p class="left_tu"><img src="{$field.litpic}" alt="{$field.title}"> </p>
          <p class="right_text"> <span>{$field.title}</span> <em>{$field.seo_description|html_msubstr=###,0,13,true}</em> </p>
          </a> </div>
          </li>
		  {/eju:arclist}
          </ul>
          <div class="gengduo">
		  {eju:type typeid='5' empty='栏目不存在时，显示这里的文案'}
		  <a href="{$field.typeurl}">
		  {/eju:type}
		  <img src="/template/default/pc/skin/img/v2ico_39.png" alt=""> </a> </div>
        </div>
      </div>
            <div class="yv2News_mode">
        <div class="NewsMode_top">
          <p class="bg"><img src="" alt=""></p>
          <p class="text"> <i><img src="/template/default/pc/skin/img/ico_y3.png" alt=""></i> <span>本地资讯</span> </p>
        </div>
        <div class="yv2News_list">
          <ul>
		  {eju:arclist typeid='6' orderby='new' row='6' id='field'}
          <li>
          <div class="tit"> <a target="_blank" href="{$field.arcurl}">{$field.title}</a> </div>
          <div class="mint_tu"> <a target="_blank" href="{$field.arcurl}" class="c">
          <p class="left_tu"><img src="{$field.litpic}" alt="{$field.title}"> </p>
          <p class="right_text"> <span>{$field.title}</span> <em>{$field.seo_description|html_msubstr=###,0,13,true}</em> </p>
          </a> </div>
          </li>
		  {/eju:arclist}
          </ul>
          <div class="gengduo">
		  {eju:type typeid='6' empty='栏目不存在时，显示这里的文案'}
		  <a href="{$field.typeurl}">
		  {/eju:type}
		  <img src="/template/default/pc/skin/img/v2ico_39.png" alt=""> </a> </div>
        </div>
      </div>
            <div class="yv2News_mode">
        <div class="NewsMode_top">
          <p class="bg"><img src="" alt=""></p>
          <p class="text"> <i><img src="/template/default/pc/skin/img/ico_y4.png" alt=""></i> <span>房吧公告 </span> </p>
        </div>
        <div class="yv2News_list">
          <ul>
		  {eju:arclist typeid='23' orderby='new' row='6' id='field'}
          <li>
          <div class="tit"> <a target="_blank" href="{$field.arcurl}">{$field.title}</a> </div>
          <div class="mint_tu"> <a target="_blank" href="{$field.arcurl}" class="c">
          <p class="left_tu"><img src="{$field.litpic}" alt="{$field.title}"> </p>
          <p class="right_text"> <span>{$field.title}</span> <em>{$field.seo_description|html_msubstr=###,0,13,true}</em> </p>
          </a> </div>
          </li>
		  {/eju:arclist}
          </ul>
          <div class="gengduo">
		  {eju:type typeid='23' empty='栏目不存在时，显示这里的文案'}
		  <a href="{$field.typeurl}">
		  {/eju:type}
		  <img src="/template/default/pc/skin/img/v2ico_39.png" alt=""> </a> </div>
        </div>
      </div>
       </div>
  </div>
</div>
<!--楼盘资讯--end-->

 

ccs样式：

/ *资讯* /
.yv2News {margin-top：0px; height：520px;} 
.yv2News_main .yv2Hotlp_title pi {width：40px; 高度：44像素；行高：44px；}
.yv2News_main .yv2Hotlp_title p span {top：12px}
.yv2News_main .yv2Hotlp_title p em {top：13px}
.yv2News_main .yv2Hotlp_title a {top：26px}
.yv2News_center {display：flex; flex-wrap：nowrap; 宽度：1200px；保证金：0自动; 页边距：5px；}
.yv2News_mode {flex：1; 宽度：calc（（100％-30px）/ 4）;
 border：1px实心#eee; 右边距：10px; 背景：#fff; 职位：相对
}
.yv2News_mode：last-child {margin-right：0;}
.NewsMode_top {width：100％; 高度：160像素；背景：＃F6F6F6; 位置：相对； z-index：0}
.NewsMode_top p.bg {width：100％; 高度：100％; 显示：无；}
.NewsMode_top p.bg img {宽度：100％; 高度：100％；}
.NewsMode_top p.text {位置：绝对；顶部：0px；左：0px；宽度：100％; 高度：100％; padding-top：40px; 文本对齐：居中；z-index：0；}
.NewsMode_top p.text i {width：60px; 高度：51px；显示：块；保证金：0自动；}
.NewsMode_top p.text i img {宽度：100％；高度：100％;}
.NewsMode_top p.text span {display：block; font-size：24px; 颜色：＃333; 边距顶部：5像素；}
.yv2News_list {padding：10px 0px; }
.yv2News_list ul li {padding：5px 0;}
.yv2News_list ul li .tit {padding：0 20px}
.yv2News_list ul li .tit a {font-size：14px; 颜色：＃666；显示：阻止；宽度：100％; 溢出：隐藏；文本溢出：省略号；空白：nowrap；}
.yv2News_list ul li .mint_tu {display：none; 填充：0 10px; border-bottom：1px实心＃E8E8E8; padding-bottom：15px;}
.yv2News_list ul li .mint_tu p.left_tu {width：120px; 高度：80像素；}
.yv2News_list ul li .mint_tu a {display：flex}
.yv2News_list ul li .mint_tu p.left_tu img {flex：1; 宽度：100％; 高度：100％；}
.yv2News_list ul li .mint_tu p.left_tu img：hover {不透明度：0.8;}
.yv2News_list ul li .mint_tu p.right_text {宽度：120像素；左边距：10像素；}
.yv2News_list ul li .mint_tu p.right_text span {display：block; font-size：16px; 颜色：＃333；宽度：100％；溢出：隐藏；文本溢出：省略号；空白：nowrap；}
.yv2News_list ul li .mint_tu p.right_text em {font-size：14px; 颜色：＃666; 行高：23px；页边距：5px；显示：-webkit-box; -webkit-box-orient：垂直； -webkit-line-clamp：2；溢出：隐藏；}
.yv2News_list .gengduo {text-align：right; 宽度：100％; 边距顶部：15px；}
.yv2News_list .gengduo a {display：inline-block; 宽度：18px；高度：31像素；右边距：20px；}
.yv2News_list .gengduo img {宽度：100％; 高度：100％；}
.yv2News_mode * {
    -webkit-font-smoothing：抗锯齿；
  -webkit-text-size-adjust：100％;
  -ms-text-size-adjust：100％；
  -webkit-box-sizing：边框框;
  -moz-box-sizing：边框框；
  框大小：border-box；
  过渡：所有0.3秒轻松；
}
.yv2News_mode {transition：transform 0.3s easy; }
.yv2News_mode：hover { 
    transform：scale（1.08,1.08）;
    z索引：2；
    box-shadow：0 0 20px 0px #ccc;
    顶部：-20px；
}
.yv2News_mode：hover .NewsMode_top p.bg {display：block;}
.yv2News_mode：hover .NewsMode_top p.text span {color：＃fe6857;}
.yv2News_mode：hover .yv2News_list ul li：nth-​​child（1）.tit {display：none;}
.yv2News_mode：hover .yv2News_list ul li：nth-​​child（1）.mint_tu {display：block;}
.yv2News_list ul li：hover .tit a {color：＃5DA750;}
.yv2News_list ul li：hover .mint_tu p.right_text span {color：＃5DA750;}

解析：

{eju:type typeid='2' empty='栏目不存在时，显示这里的文案'}

typeid='2'  2代表栏目ID 根据自己需求替换对应ID

{$field.seo_description|html_msubstr=###,0,13,true}

13带代表调用内容字节

jjky8888
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
一个好看的首页新闻content
Lily_feng的博客
07-06 667
新闻页面 网站首页的新闻部分，通常在首页的footer的上个部分，主要展示一些有关公司的信息，公司的活动或者热流，用户可以更直观地了解到本公司主营的一些产品，也属于一个banner的一部分吧。以上纯属个人理解，如觉得有更好的理解，乐意大家提的，微笑。上代码 html部分： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>新闻2</tit
易优cms 标签常用函数
eyoucms的博客
03-08 761
统计栏目文章数 —— GetTotalArc(当前栏目ID)，示例：{$eyou.field.typeid|GetTotalArc=###}描述：截取arclist标签里文档内容的前11个字符（富文本截取，自动过滤html代码，自带省略号）纯文本长度截取 —— text_msubstr(字符串, 开始位置, 截取长度, 是否显示省略号)富文本长度截取 —— html_msubstr(字符串, 开始位置, 截取长度, 是否显示省略号)EyouCms简单易用…EyouCms简单好用…EyouCms简单易用…
eyoucms标签常用函数
weixin_33825683的博客
07-20 348
【基础用法】名称：无功能：作用于标签变量语法：{$field.typename|html_msubstr=###,0,10,true}注意：函数与字段名之间用竖线（|）隔开，###表示当前变量参数：无底层字段：无函数列表：日期格式化 —— MyDate(日期格式, 时间字段)纯文本长度截取 —— msubstr(字符串, 开始位置, 截取长度, 是否显示省略号)富文本长度截取 —— html_ms...
php去掉html并截取字数,【php函数】截取内容清除html之后的字符串长度，支持中文和其他编码...
weixin_29216957的博客
03-24 143
截取内容清除html之后的字符串长度，支持中文和其他编码functionhtml_msubstr($str,$start=0,$length,$suffix=false,$charset="utf-8"){$str=wd_htmlspecialchars_decode($str);$str=checkStrHtml($str);returnmsubstr($str,$sta...
易优seo_description标签不过滤html，应该怎么写呢？
eyoucms的博客
07-04 1233
问：seo_description标签不过滤html，应该怎么写呢，{$field.seo_description|msubstr=###,0,200,true}，我是这样写的，给过滤掉了 答：{$field.seo_description} 文章来源：https://www.eyoucms.com/ask/list_2_7/101.html ...
易优cms 如何对描述字符description限制字数
eyoucms的博客
07-11 2246
在eyoucms中，在列表页调用文章摘要的方法主要有：1：{$field.seo_description}2：{$field.seo_description|html_msubstr=###,0,90,true}方法一：{$field.seo_description}需要配合{eyou:arclist titlelen='40' row='4' infolen='100'}使用，infolen='...
易居cms房产网站系统-PHP
06-20
易居cms房产网站系统主要针对房地产行业开发的房产网站系统，以thinkphp5.0为内核开发，主要有新房功能、二手房、租房功能。目前版本主要为新房 易居cms房产网站系统功能说明： 1、新房发布 2、楼盘团购 3、楼盘资讯...
易居cms房产网站系统
08-15
首先，易居CMS的核心功能是新房管理。这包括新房项目的发布、展示、查询和管理。系统允许管理员上传新房项目详细信息，如项目位置、户型、面积、价格、开盘时间等，并支持多维度的搜索和排序，便于用户快速找到符合...
易居cms房产网站系统 v1.1 bulid1129
08-22
易居CMS的新房发布模块是系统的核心部分，它允许管理员方便地添加和管理新楼盘信息。此功能可能包括以下关键点： 1. **楼盘信息录入**：系统提供一个友好的后台界面，让管理员能输入楼盘的基本信息，如名称、位置、...
易居cms房产网站系统 v1.0 bulid1029
09-29
首先，我们来详细了解易居CMS系统的各项功能： 1. **新房发布**：此功能允许用户便捷地发布新房源信息。这包括项目名称、地理位置、开发商、开盘时间、价格区间、户型介绍、配套设施等关键信息。通过完善的房源录入...
易居cms房产网站系统 v1.0
10-21
易居cms房产网站系统主要针对房地产行业开发的房产网站系统，以thinkphp5.0为内核开发，主要有新房功能、二手房、租房功能。目前版本主要为新房功能说明：1、新房发布2、楼盘团购3、楼盘资讯4、楼盘报名5、区域设置等相关功能，具体功能以演示站后台体验为主安装环境要求操作系统：Linux/Unix/Windows软件环境：Apache/Nginx/IIS + PHP 5.5~7.1 + MySQL 5.0 及以上本地电脑推荐使用PHPstudy安装，及安装在合适的网站空间、虚拟主机上。默认后台 域名/login.php
易居cms 增加用户组判断规则 （备））
李元波的博客 -博网先锋
02-25 187
<!-- 前台识别用户等级实现不同效果 --> 打开 root/application/home/model/Ershou.php 修改第54行 $field = !empty($field) ? $field : 'd.*,b.*, a.*,c.dirname,c.dirpath,c.parent_id'; 为 $field = !empty($field) ?...
siteserver/sscms 首页新闻排版及代码
Red_Liu
06-29 532
siteserver/sscms 首页新闻排版及代码
新闻资讯CMS内容管理系统的设计与实现（一）
热门推荐
Remoa的休闲茶馆
05-15 2万+
新闻资讯CMS内容管理系统的设计与实现（一）目录：1、项目背景：2、项目规划：3、系统结构图：4、系统架构图：5、系统用例图：6、业务流程图：7、E-R图：8、领域模型：9、数据字典：10、DDL建表语句：11、数据流图：1、项目背景：如标题，新闻资讯CMS内容管理系统的设计与实现，主要功能包括浏览新闻、编辑发布、用户管理、评论回复、文章收藏、广告管理、分栏管理等等。后台框架：Spring + S...
城市生命线智慧管廊解决方案.pptx
最新发布
08-13
城市生命线智慧管廊解决方案.pptx
智慧园区综合管理平台系统解决方案-2.pptx
08-13
智慧园区综合管理平台系统解决方案-2.pptx
财务收支管理系统-出纳账.xlsm
08-13
工资表，财务报表，对账表，付款申请，财务报告，费用支出表，财务收支 适用人群：学习不同技术领域的小白或进阶学习者；可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。
易居中国销售案场执行治理手册
该文件是易居中国制定的《销售案场执行治理手册》，旨在为所属销售案场提供一套统一、规范的执行标准，以提升销售团队的专业素质和服务质量，增强企业的综合竞争力。手册分为三个主要部分： 第一篇：案场形象篇 这...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值