CSS 超出隐藏问题
- border-bottom: 0 solid #DDD;
- border-top: 1px dotted transparent;
- color: #4f99c6;
- text-align: center;
- font-size: 13px;
:first-child和:last-child
用来选择某个元素的第一个子元素。
//输入ul li:first-child
//输入ul li:last-child
刚刚有个这方面的视频,视频的系列名称叫做 《Buid New World》 里面的第八集是讲CSS3 选择器的,有机会看看吧 CSS中的background-imgage的url老是忘记,现在写出来特意记一记
background-image: url(/html/image/logo.gif);
---------------------------------------------------------------------------------------------------------------------------151029
今天遇到超出隐藏问题,网上资料显示:
<span style="color:#ff0000;">text-overflow:ellipsis;</span>//让超出的用...实现 ellipsis省略号
<span style="color:#ff0000;">white-space:nowrap;</span>//禁止换行
<span style="color:#ff0000;">overflow:hidden;</span>//超出的隐藏
http://www.jb51.net/css/177595.html在chrome下测试未生效
另有:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<span style="width:200px; height:20px; border:0px; overflow:hidden; float:left;" id="more1">测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容</span><span onclick="document.getElementById('more1').style.height='auto'"> 显示更多</span>
</body>
</html>
效果能够实现,
overflow:hidden;float:left(或right);是必须的
但是同行内相邻<span></span>会受float:left影响引起错位,有待更进一步学习研究
--------------------------------------------------------------------------------------------------------------------------------------151102
CSS 超出隐藏问题的更多相关文章
- css超出隐藏显示省略号怎么设置?
当我们在进行网页前端开发的时候,一般获取文章标题,然后一行一行的显示.但是当标题过长的时候,就会造成换行显示.还有显示部分文本信息时,如果全部显示就过于繁琐,会带来不会的网页体验感.虽然我们可以使用o ...
- css 超出隐藏显示...
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...
- CSS 超出隐藏实现限制字数的功能代码(多浏览器支持)
<html> <title>css控制字数</title> <head> <style type="text/css"> ...
- CSS——文本超出隐藏显示省略号
文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...
- css文本超出隐藏 显示三个点
文本超出显示三个点一般分两种情况 一,单行文本超出隐藏 overflow:hidden; text-overflow:ellipsis; white-space:nowrap; 二,多行文本超出隐藏 ...
- CSS实现不换行/自动换行/文本超出隐藏显示省略号
在写页面的时候,我们经常会需要用到关于文本的换行,强制换行以及显示几行超过显示省略号等,今天我们就对这些问题来做个汇总吧! 1.自动换行 div{ word-wrap:break-word; word ...
- CSS中隐藏内容的3种方法及属性值
CSS中隐藏内容的3种方法及属性值 (2011-02-11 13:33:59) 在制作网页时,隐藏内容也是一种比较常用的手法,它的作用一般有:隐藏文本/图片.隐藏链接.隐藏超出范围的内容.隐藏弹出 ...
- css 超出部分显示省略号
代码: overflow: hidden; white-space: nowrap; text-overflow: ellipsis; 重点代码:text-overflow: ellipsis; 解 ...
- CSS中隐藏内容的3种方法
CSS中隐藏内容的3种方法 一般有:隐藏文本/图片.隐藏链接.隐藏超出范围的内容.隐藏弹出层.隐藏滚动条.清除错位和浮动等. 1.使用display:none来隐藏所有内容 display:none可 ...
随机推荐
- php执行root命令
一.确定php的sysem等函数可用 二.编写c程序,如ipt.c #include <stdio.h>#include <stdlib.h>#include <sys/ ...
- [转]MongoDB密码设置(基于windows)
参考文档:http://www.cnblogs.com/zengen/archive/2011/04/23/2025722.html MongoDB部署到Windows上后是默认是无权限限制的的. ...
- smarty模板原理和增删改查例题
Smarty模板:(前后端分离)原理:核心是一个类,先修改配置文件,在使用的时候引入配置文件即可,(init.inc.php)$smarty->assign("ceshi", ...
- Object[]arr代码输出奇怪字符的解释
代码:class lizi { public static void main(String[] args){ //TODO Auto-generated method stub Object[ ...
- Android百分比布局支持库介绍——com.android.support:percent(转)
转载自http://www.apkbus.com/forum.php?mod=viewthread&tid=244752&extra=&_dsign=0b699c42 在此之前 ...
- UIView画虚线边框
//fatherView加虚线边框 -(void)boundingRectangleForView:(UIView *)fatherView{ CAShapeLayer *borderLayer = ...
- Bomb---hdu5934(连通图 缩点)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5934 题意:有n个炸弹,每个炸弹放在(x, y)这个位置,它能炸的范围是以 r 为半径的圆,手动引爆这 ...
- 《奥威Power-BI销售计划填报 》精彩回顾
我们经常遇到这样的问题:业务单据是来自ERP系统,销售计划是EXCEL做的,想把两者整合在一起做分析,怎么办? 单据大,导出EXCEL太费劲,也很难分析到历史数据,但又不能动ERP系统 (自己也不会改 ...
- windows2003服务器mysql每天定时备份
1.php利用mysqldump备份数据库,代码如下: <?php /** * 数据库备份 */ $sqlname = $argv[1]; //接受bat或cmd传过来的第一个参数 要备份的数据 ...
- asp获取文件名和扩展名的函数代码
<% '获取文件名(不含扩展名) Function getFilename(text)text = Left(text,inStrRev(text,".")-1)getFil ...