`
yzz9i
  • 浏览: 221181 次
  • 性别: Icon_minigender_1
  • 来自: 湖南
社区版块
存档分类
最新评论

怎么控制 显示 DIV 里面的 字数 只显示部分文字

阅读更多
在 DIV 里面加如下 样式就可以了。

<div style= "height:40px; width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">   高度可自己设定


-----------------------------------------------------------

引用

  <!-- 主显DIV 管理公告信息start -->
   
            <div style="margin-top:20px;margin-left:6px;margin-right:6px;border:1px solid silver;">
         <table  style="width:100%;font-size: 11px;">
            <tr>
               <td bgcolor="#DBEAF8">
                   <font size=2px>  公告管理</font>
                   &nbsp;&nbsp;&nbsp;&nbsp;
                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
              
                <input type=button value="发布公告信息" onClick="uploadInfo()"/>
               </td>
            </tr>
             <!-- 循环体start -->
            <c:forEach items="${resultMap.list}" var="result">
             <tr>
               <td>
                 <div style="border:1px solid silver;">
                   <table style="width:100%;font-size: 11px;">
                      <tr>
                         <td>
                           <div>
                            <table   width="100%" style= "border:1px solid silver;table-layout: fixed" >
             <tr>
              <td width="15" align="left"><img src="images/ad-sdImages/gg02.jpg"/></td>
               <td width="70" align="left">
                  <font size=1 color="blue"><a style="text-decoration: none;" href="">
               <c:if test="${result.asType==-1}">[系统公告]</c:if>
               <c:if test="${result.asType==20}">[政策公告]</c:if>
               <c:if test="${result.asType==21}">[出票公告]</c:if>
               <c:if test="${result.asType==22}">[财务公告]</c:if>
                  </a></font>
               </td>
                <td align="left"><font size=1 color="blue"><a href="">${result.asTitle}</a>    [发布人:${result.asPromulgator}][点击数:${result.readSum}][发布时间:${result.asIssueTime}]</font></td>
                <td width="130px" align="right">
                <a style="text-decoration: none;">
                <font size="1" color="blue">[置顶][取消置顶][编辑][删除]</font>
                </a>
                </td>
             </tr>
             <tr>
                <td align="left" colspan="4"><div style= "height:40px; width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"><font size=2 color="blue">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;${result.asContent}</font></div></td>
             </tr>
         </table>
                           </div>
                         </td>
                      </tr>
                   </table>
                  
                 </div>
               
               </td>
            </tr>
         </c:forEach>
            <!-- 循环体end -->
            
         </table>
        
         <!-- 分页脚 -->
          <table style="width: 100%">
      <tr>
      <td align="right">
         <table>
            <tr>
      <td><a style="text-decoration: none" href="flightInfo.do?p=flightInfoSearch&page=1&passenger=${flightMap.passenger}&flightNo=${flightMap.flightNo}&ticketNo=${flightMap.ticketNo}&ticket_All=${flightMap.ticket_All}&phone=${flightMap.phone}&takeOff_time=${flightMap.takeOff_time}&takeOff_time02=${flightMap.takeOff_time02}&input_time=${flightMap.input_time}&input_time02=${flightMap.input_time02}&receive_time=${flightMap.receive_time}&receive_time02=${flightMap.receive_time02}"><font size="1px" color="blue">[首     页]</font></a></td>
   <td><a style="text-decoration: none" href="flightInfo.do?p=flightInfoSearch&page=${flightMap.page-1}&passenger=${flightMap.passenger}&flightNo=${flightMap.flightNo}&ticketNo=${flightMap.ticketNo}&ticket_All=${flightMap.ticket_All}&phone=${flightMap.phone}&takeOff_time=${flightMap.takeOff_time}&takeOff_time02=${flightMap.takeOff_time02}&input_time=${flightMap.input_time}&input_time02=${flightMap.input_time02}&receive_time=${flightMap.receive_time}&receive_time02=${flightMap.receive_time02}"><font size="1px" color="blue">[上一页]</font></a></td>
   <td><a style="text-decoration: none" href="flightInfo.do?p=flightInfoSearch&page=${flightMap.page+1}&passenger=${flightMap.passenger}&flightNo=${flightMap.flightNo}&ticketNo=${flightMap.ticketNo}&ticket_All=${flightMap.ticket_All}&phone=${flightMap.phone}&takeOff_time=${flightMap.takeOff_time}&takeOff_time02=${flightMap.takeOff_time02}&input_time=${flightMap.input_time}&input_time02=${flightMap.input_time02}&receive_time=${flightMap.receive_time}&receive_time02=${flightMap.receive_time02}"><font size="1px" color="blue">[下一页]</font></a></td>
   <td><a style="text-decoration: none" href="flightInfo.do?p=flightInfoSearch&page=${flightMap.count}&passenger=${flightMap.passenger}&flightNo=${flightMap.flightNo}&ticketNo=${flightMap.ticketNo}&ticket_All=${flightMap.ticket_All}&phone=${flightMap.phone}&takeOff_time=${flightMap.takeOff_time}&takeOff_time02=${flightMap.takeOff_time02}&input_time=${flightMap.input_time}&input_time02=${flightMap.input_time02}&receive_time=${flightMap.receive_time}&receive_time02=${flightMap.receive_time02}"><font size="1px" color="blue">[尾     页]</font></a></td>
       <td>&nbsp;&nbsp;&nbsp;&nbsp;</td>
       <td><font size="1px">共${flightMap.count}页&nbsp;当前第${flightMap.page}页</font></td>
     <td><font size="1px">共有数据${flightMap.sum}条</font></td>
     </tr>
     </table>
      </td>
      </tr>
  </table>
        
        
    </div>
      
    <!-- 主显DIV 管理公告信息end -->
 
分享到:
评论

相关推荐

    ajax控制div窗口显示和隐藏

    本主题主要关注如何使用Ajax来控制div窗口的显示和隐藏,这对于实现交互式用户体验至关重要。 一、Ajax基础 Ajax的核心是JavaScript对象XMLHttpRequest,它在后台与服务器进行通信,实现了异步数据传输。创建一个...

    控制Div显示和隐藏

    本程序在网页中设计了Div层的显示和隐藏,代码简单、实用。

    鼠标移动到div上显示制定信息或者div(自适应显示位置)

    在网页设计中,有时我们需要实现一个功能:当用户将鼠标悬停在某个div元素上时,显示特定的信息或另一个div。这个功能可以增强用户体验,帮助用户更好地理解和操作页面。本教程将详细介绍如何实现这一功能,并确保...

    js鼠标浮动显示div

    这种技术的核心是利用事件监听器来捕捉鼠标的移动,并根据鼠标的移动来控制div元素的显示与隐藏。在本案例中,"js鼠标浮动显示div"指的是当鼠标移动到特定的input元素上时,会显示出一个div层,该div层中包含有与...

    多个iframe,显示其中一个frame中的div,并处于最上层显示

    在网页设计和开发中,有时候我们需要处理多个`iframe`(内联框架)并实现特定的交互效果,例如只显示其中一个`iframe`中的`div`元素,并确保它在所有其他元素之上,即处于最上层显示。这样的需求通常出现在需要创建...

    鼠标放上去显示div

    当我们想要在用户将鼠标悬停在某个元素上时显示额外的信息,我们可以利用CSS来隐藏这个div,然后通过JavaScript事件监听器在鼠标悬停事件触发时显示它。 首先,我们需要创建一个div,并将其样式设置为默认隐藏。在...

    点击按钮(a标签)隐藏显示div内容,切换div内容

    超级实用的点击隐藏,显示div内容,切换div内容 点击按钮(a标签)

    div边框加文字效果

    div边框加文字效果

    Div显示与隐藏网页制作

    在"Div显示与隐藏网页制作"这个主题中,我们将探讨如何利用`Div`实现网页元素的动态显示和隐藏,这对于创建交互式和响应式的网页至关重要。 在网页设计中,有时我们需要根据用户的行为或者特定条件来控制某些内容的...

    onclick事件实现div的隐藏和显示

    在这个场景中,我们讨论的是如何利用 "onclick" 事件来控制 `div` 元素的隐藏和显示,这在构建动态网页时非常常见。 首先,我们需要了解 `div` 是HTML中的一个块级元素,通常用于组织页面布局。隐藏和显示 `div` ...

    html+javascript只显示部分文章内容(一部分文字), 加载更多按钮 展开,收缩.zip

    总的来说,通过HTML构建基本的页面结构,结合JavaScript实现动态交互,我们可以轻松地创建“只显示部分文章内容,加载更多/展开、收缩”的功能。这个过程涉及到HTML元素的选择与操作、事件监听以及CSS样式控制,是...

    两个DIV同一行显示

    在网页设计与开发中,如何让两个或多个`&lt;div&gt;`元素在同一行显示是一个常见的需求。这涉及到CSS(层叠样式表)的布局控制技术,是前端开发的基础技能之一。根据给定的文件信息,我们可以深入探讨这一主题,了解如何...

    div显示隐藏效果

    `div` 显示和隐藏效果是前端开发中的常见需求,可以用来控制用户界面的可见性,例如实现折叠菜单、弹窗或者动态加载内容等。在本教程中,我们将深入探讨如何在HTML和CSS中实现`div`的显示与隐藏效果。 首先,我们...

    纯CSS 鼠标经过DIV另一个显示隐藏 多个DIV并存

    在这个特定的主题中,“纯CSS 鼠标经过DIV另一个显示隐藏 多个DIV并存”是指通过CSS实现的一种交互效果:当鼠标悬停在一个div上时,另一个关联的div会显示出来,同时其他无关的div保持隐藏状态。这种效果在创建导航...

    js 实现div里面的内容滚动,并可以通过按钮控制

    【标题】:“JS实现div内滚动内容及按钮控制” 在网页设计中,有时我们需要在一个固定的div区域展示大量的文本或图片,而这个div的大小又是有限的。这时,我们可以利用JavaScript来实现div内的滚动效果,并通过按钮...

    JS+CSS 控制Img在div中居中显示一部分

    JS+CSS 控制Img在div中居中显示一部分

    鼠标移到控件就会显示DIV显示 说明

    鼠标移到控件就会显示DIV显示,div里面可以进行任意活动,一般都是用来说明,这里就用到超链接来说明

    网页设计div的显示和隐藏

    而如何有效地控制div元素的显示与隐藏,则是实现交互式设计的重要手段之一。本文将详细介绍如何通过CSS属性(如`visibility`和`display`)以及JavaScript来实现div的显示与隐藏功能。 #### 一、CSS中的visibility...

    js控制div全屏

    在网页设计中,有时我们需要将某个`div`元素设置为全屏显示,以提供沉浸式的用户体验或特定功能的实现。JavaScript(简称js)作为一种强大的客户端脚本语言,可以帮助我们轻松实现这一需求。在这个项目中,我们使用...

Global site tag (gtag.js) - Google Analytics