实际工作中遇到的一些css
1、除去table默认的每个单元格带有的类似内边距的空白
如设置了table和td的border后,是这个样子:
,设置<table cellspacing="0" >后变成这个样子:
。
2、除去radio和checkbox四种的一圈类似内边距的空白
像下面这样:
,设置background: transparent;后变成这个样子:
。里面的豆沙绿是由于电脑的设置,无法改变。
3、有时子元素float后,父元素的border显示不太正常。这个情况遇到过一次,父元素ul、子元素是li。像下面这样,部分border显示不支持:
当li节点全部预先写在html里时,表现正常;在IE8中,li如果是页面加载后自动动态添加进去的话,则出现了border错位。而如果是通过单击事件添加的节点,则又表现正常了。我以为是不是在没有用户参与的事件(如页面加载事件)里添加事件就会出现border错位?.....尼玛最后在一点点排除js和html节点结构后发现是DOCTYPE的问题,把
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">改成
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
后在IE8里正常了,......啊,累死了。(后话:但是二者在IE6里都不正常。最终我是用display:inline-block;代替float后IE6里也正常了(
注: 修改inline元素的display属性为inline-block后,所有的浏览器都是支持的。修改block元素的display属性为inline-block后,IE6及以下的老版浏览器都是不支持的。可使用float:left; display:inline;代替display:inline-block;解决这种不兼容问题。))
4、节点(比如行内元素)标签之间的空格/换行导致的空白
比如CSS这样:span,input{border:1px solid black;},HTML这样:
<body>
<span>1111</span>
<input type='text' value='222'>
<span>333</span>
</body>
结果IE8这样:
。把HTML改成这样:
<body>
<span>1111</span><input type='text' value='222'><span>333</span>
</body>
结果IE8会变成这样:
。(chrome里行内元素有个默认的margin,需要margin:0;以后才会变成IE8里这样)
实际工作中遇到的一些css的更多相关文章
- css布局 - 工作中常见的两栏布局案例及分析
突然想到要整理这么一篇平时工作中相当常见但是我们又很忽视的布局的多种处理方法.临时就在我经常浏览的网站上抓的相对应的截图.(以后看到其他类型的我再补充) 既然截了图,咱们就直接看人家使用的布局方式,毕 ...
- css/js(工作中遇到的问题)-6
页面resize方法 if(document.createEvent) { const event = document.createEvent ("HTMLEvents"); e ...
- 【开源】【前后端分离】【优雅编码】分享我工作中的一款MVC+EF+IoC+Layui前后端分离的框架——【NO.1】框架概述
写博客之前总想说点什么,但写的时候又忘了想说点什么,算了,不说了,还是来送福利吧. 今天是来分享我在平时工作中搭建的一套前后端分离的框架. 平时工作大多时候都是在做管理类型的软件开发,无非就是增.删. ...
- 设计中最常用的CSS选择器
准确而简洁的运用CSS选择器会达到非常好的效果.我们不必通篇给每一个元素定义类(class)或ID,通过合适的组织,可以用最简单的方法实现同样的效果.在实际工作中,最常用的选择器有以下五类: 一.标签 ...
- 04. H5标签有哪些?行内元素有哪些?块级元素有哪些?空(void)元素有哪些?行内元素和块级元素有什么区别?你工作中常用标签有什么?
4. H5标签有哪些? 2)行内元素有哪些? a - 锚点 em - 强调 img - 图片 font - 字体设定 ( 不推荐 ) i - 斜体 input - 输入框 3)块级元素有哪些? add ...
- 记录下工作中使用的pdf.js
在工作中遇到一个通过网页的形式浏览pdf文件以及图片的需求,图片简单,直接通过网页的形式打开这个图片的URL即可.而pdf这边,通过查询发现有一个名为pdf.js的神器. 简单介绍下,它可以在html ...
- 网页设计中11 款最好CSS框架
网页设计和发展领域已经成为竞争激烈的虚拟世界.想要在网络的虚拟世界中生存,仅有一堆静止的在线网络应用是远远不够的,网页必须要有很多功能,配以让人无法抗拒的设计.网页编码一定要合适.精确,才能保证不发生 ...
- 随机记录工作中常见的sql用法错误(一)
没事开始写博客,留下以前工作中常用的笔记,内容不全或者需要补充的可以留言,我只写我常用的. 网上很多类似动软生成器的小工具,这类工具虽然在表关系复杂的时候没什么软用,但是在一些简单的表结构关系还是很方 ...
- 工作中常用的js、jquery自定义扩展函数代码片段
仅记录一些我工作中常用的自定义js函数. 1.获取URL请求参数 //根据URL获取Id function GetQueryString(name) { var reg = new RegExp(&q ...
随机推荐
- XML解析方式与解析工具
DOM解析原理: 1)JAXP (oracle-Sun公司官方) 2)JDOM工具(非官方) 3)Dom4J工具(非官方) 三大框架(默认读取xml的工具就是Dom4j) ....... SAX解析原 ...
- d010: 分离自然数
内容: 一个三位自然数,分离出它的百位.十位与个位上的数字 输入说明: 一行一个三位整数 输出说明: 一行三个数字 , 空格隔开.分别是百 十 个位数字 输入样例: 256 输出样例 : 2 5 ...
- MyEclipse 点击 部署 按钮 无效的解决办法
问题描述 1 通常情况下,当我们点击MyEclipse任务栏上的部署按钮时,会弹出项目部署框,如下图: 2 但我们有时也会遇到点击部署按钮怎么也弹不出项目部署框的问题. END 解决方法一: 1 ...
- java-Mysql-SQLServer数据类型匹配速查表
java-Mysql-SQLServer数据类型匹配速查表 Mysql ************************************ 当前列 ClassName ColumnType Di ...
- MemCache内存缓存系统
memcached是一种缓存技术, 他可以把你的数据放入内存,从而通过内存访问提速,因为内存最快的, memcached技术的主要目的提速, 默认情况下占用的端口号为:11211. 在memachec ...
- 转: pthread_detach()函数
创建一个线程默认的状态是joinable. 如果一个线程结束运行但没有被join,则它的状态类似于进程中的Zombie Process,即还有一部分资源没有被回收(退出状态码). 所以创建线程者应该调 ...
- json转换为键值对辅助类
/// <summary> /// json转换为键值对辅助类 /// </summary> public class JsonParser { private static ...
- Stack Overflow requires external JavaScript from another domain, which is blocked or failed to load.
出现以上问题,只是说明stackoverflow前端库用到google的API来,所以stackoverflow躺枪.查阅后,是因为调用jquery的问题. 详情请看: 解决方案有好几种: 1.将ht ...
- Linux下安装GCC5.3.0(亲测有效)
对于linux小白来说,只需要先知道怎么安装,至于为什么等学了linux再说吧..知识不系统的坏处啊! 首先,一般ubuntu上都预装了低级版本的Gcc,完全可以应付刷OJ时的C+Class+STL的 ...
- 使用java创建kafka的生产者和消费者
创建一个Kafka的主题,连接到zk集群,副本因子3,分区3,主题名是test111 [root@h5 kafka]# bin/kafka-topics.sh --create --zo ...