`
383533005
  • 浏览: 9250 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

css控制溢出文字替换为点符号显示

阅读更多

  

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <style type="text/css">
	/* IE下的样式 */ 
	p span{
		display: block;
		width:250px;	/*对宽度的定义,根据情况修改*/
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;	/*可选值:clip:不现实溢出文字;ellipsis:将溢出文字用'...'省略显示*/
	}
	/* FF 下的样式 */ 
	p{clear:both;}
	p span{
		float:left;
		max-width:175px;   /*IE不能解释该属性,而FF可以*/
	}
	p:after{
		content:"...";
	}
  </style>
 </HEAD>

 <BODY>
	<div>
		<p>
		<span>
			http://383533005.iteye.com/http://383533005.iteye.com/http://383533005.iteye.com/http://383533005.iteye.com/http://383533005.iteye.com/
		</span>
		</p>
	</div>
 </BODY>
</HTML>

 

 

 

效果图:      

  • 大小: 4.1 KB
分享到:
评论

相关推荐

    从零学CSS系列之文本属性

    在学习CSS时,文本属性是基础中的基础,了解和...通过合理运用这些属性,可以使页面上的文字显示更符合设计者的预期,并提升用户的阅读体验。希望这些基础知识点能够帮助大家在进行网页设计和前端开发时更加得心应手。

    CSS属性大全完整版网页设计前台设计程序员必备手册

    标题“CSS属性大全完整版网页设计前台设计程序员必备手册”以及描述中的相同文字,明确指出这是一份详尽的CSS(层叠样式表)属性指南,专为网页设计师和前端开发者准备。CSS作为网页设计中至关重要的语言,用于控制...

    CSS 速查表CSS 速查表.pdf

    ### CSS 速查表知识点详解 #### 一、盒子模型(Box Model) 在网页设计中,一个元素的布局可以通过盒模型来定义。盒模型包括四个主要部分:边距(margin)、边框(border)、填充(padding)和实际内容(content)。 - **...

    CSS标签大全.docx

    - `overflow`:处理元素内容溢出,如`hidden`(隐藏溢出)、`scroll`(显示滚动条)和`auto`(自动)。 - `clip`:裁切元素超出容器的部分,使用`rect()`函数定义裁切区域。 以上是CSS中的一些核心属性,它们共同...

    CSS速查表 网页设计语法手册与快捷键 介绍简单明了 很不错

    这些知识点涵盖了网页设计中常用的CSS属性和Dreamweaver的快捷键,对于网页设计师来说,掌握这些技巧能够极大地提高工作效率和设计质量。无论是布局调整、文本样式设计还是交互效果的实现,都能通过灵活运用上述属性...

    实现字符串的数据提取,根据一串字符显示的内容,提取对应的数据的实现,此代码实现希望能帮到各位

    在编程语言中,字符串是由字符组成的序列,可以是字母、数字、符号或其他任何可打印的字符。字符串处理通常包括字符串的创建、操作、搜索和转换等任务。 在描述的场景中,我们面临的主要挑战是如何从一串字符中提取...

    listbox添加部分隐藏字符

    例如,可以将敏感信息替换为星号(*)或其他特殊符号。以下是一个简单的C#示例: ```csharp protected override void OnDrawItem(DrawItemEventArgs e) { if (e.Index &gt;= 0) { String itemText = Items[e.Index]....

    导航条_导航条_html_

    `a` 元素作为链接,`#` 只是一个占位符,实际应替换为相应页面的 URL。 接下来,我们需要使用 CSS 来美化这个导航条。以下是一些基本样式: ```css /* 导航条整体样式 */ nav { background-color: #333; /* 设置...

    HTML超出文本多行截取实现原理及代码

    例如,通过匹配句末的标点符号或单词边界,并在这些位置进行替换操作,可以实现“优雅的”文本截断效果。 ### 知识点五:实现原理及代码详解 在给出的示例代码中,我们有两个`&lt;div&gt;`元素,各自包含一个`&lt;p&gt;`子元素...

    C#编程经验技巧宝典

    79 &lt;br&gt;0115 如何判断是否为数字 79 &lt;br&gt;0116 如何在字符串中查找指定字符 79 &lt;br&gt;0117 如何在字符串中用一子串替换另一子串 80 &lt;br&gt;0118 将新字符串添加到已有字符串中 80 &lt;br&gt;0119 如何在...

    高效的jquery数字滚动特效

    具体到实现上,插件通过创建一个包含数字的`span`元素数组,并使用JavaScript的`setTimeout`或`setInterval`函数,按照设定的速度逐步替换显示的数字,从而实现滚动效果。插件还考虑了不同数字长度和格式的情况,以...

    用JQuery在网页中实现分隔条功能的代码

    接着,使用CSS将元素设置为相对定位,并根据浮动方向添加相应的溢出隐藏。通过 `wrapInner` 方法将内容包裹在一个新的 `div` 元素(class为 'jsplit-c')内,这样可以确保分隔条不影响原有的内容布局。 然后,向 `...

    Javascript中55个经典技巧

    JavaScript是Web开发中不可或缺的一部分,它为网页添加了动态功能,让交互变得生动有趣。这篇博文"Javascript中55个经典技巧"汇总了一些JavaScript开发者应该掌握的核心技能和实用技巧,旨在提升代码质量和效率。...

Global site tag (gtag.js) - Google Analytics