DIV和CSS排版中制作细线条的几种方法

转载 2007年09月22日 17:42:00

DIV和CSS排版中制作细线条的几种方法

今天制作div的高度控制的时候发现IE下控制div的高度很小的时候无效,特意查了一下相关文章。

最终有了解决方案,参考下面文章:

如果要制作一条高度小于12PX(大约)的线条,在IE中会显示出高于实际高度的,看下面。

<style>
.line{
background: #CCCCCC;
height: 6px;
}</style>
<div class="line"></div>
可看出实际高度大于6PX,这也算是IE的一个BUG吧。以下三种方法可解决这个问题,推荐使用第一种方法。
1:

<style>
.line11{
background: #CCCCCC;
height: 6px;
overflow: hidden;
}</style>
<div class="line11"></div>
2. div之间要加个空格 注:IE5.0 无效

<style>
.line12{
background: #336699;
line-height: 6px;
}</style>
<div class="line12"> </div>
3:

<style>
.line13{
background: #CC0000;
height: 6px;
font-size: 1px;
}</style>
<div class="line13"></div>
 

CSS实现极细边框的原理

CSS实现极细边框的原理 #line1 {border-top: 1px solid red;} #line2 {border-top: 1px solid red; trans...
  • tangxinzhuan
  • tangxinzhuan
  • 2016年12月14日 22:58
  • 1045

Div+Css控制网页排版小记.

新的学期,空闲时间比较多,借着刚买的玩具云服务器,准备搭建一个个人主页玩一玩。所以顺便学习下html的知识。        结果呢,学着html发现就要连着css,javascript,jquery...
  • qq_24894159
  • qq_24894159
  • 2016年10月16日 23:26
  • 633

两边细中间粗的线条

.a { margin-bottom: 4px; height: 0.5px; width: 2px; border-radius: 50%; background: -webkit-radial-g...
  • Angular_
  • Angular_
  • 2017年03月16日 18:59
  • 704

关于div+css的排版布局

css css通常被称为风格样式表(Style Sheet),是用来进行网页风格设计的。通过设立样式表,可以统一的控制HTML中标签的显示属性,精确地定位网页元素的位置,从而更有效的美化页面外观。...
  • hhrxp373317
  • hhrxp373317
  • 2013年09月11日 16:15
  • 1442

CSS3实现手机1px边框,细如发丝

前言 我们使用手机App的WebView和浏览器查看网页时,经常能看见那细如发丝的“0.5px”的边框、线条,让整个页面效果看起来更加细致。这里所谓的“0.5px”是如何实现的呢,web页面中最小的单...
  • bingkingboy
  • bingkingboy
  • 2016年03月10日 22:22
  • 7293

用div做一个1px高的线条

问:为什么我设置的div的高度是1px,为什么看不到效果啊,div老是那么高。答:给你的div加一个属性:font-size:0; 说明:这个问题出现在IE6中;IE6中的div默认有个最小字体高度,...
  • Hady6
  • Hady6
  • 2007年11月27日 03:38
  • 756

前端学习第三弹:利用div+css制作个人简历

尝试用纯html制作简历,但是显得过于死板,参数设置不灵活,由于刚刚接触这一块,从网上找了很多资源,先输出后输入,通过一个具体的例子查缺补漏,这样学起来更有劲头也更具效率。        具体代码如下...
  • u014483914
  • u014483914
  • 2017年10月07日 16:02
  • 733

使用Div和CSS来排版页面布局

1.这里的div并不是我们所说的层,虽然他们的标签都是,在这里你可以把div理 解成一个容器,它可以放文字,图片,表格等等.      2.用div布局必须对页面的结构进行准确的分析,当然用tab...
  • T_Mac_one
  • T_Mac_one
  • 2013年09月27日 10:47
  • 728

用DIV+CSS实现图片行和列排版

1.设置图片所在层的宽度width:800px; 2.定义图片的宽度width: 195px;  195.gif">  195.gif">  195.gif">  195.gif"> ...
  • lchyz89
  • lchyz89
  • 2012年07月05日 10:59
  • 1342

怎样用MindManager实现线条渐细效果?

在MindManager中制作思维导图,我们可以通过许多细节属性设置,让其满足我们的视觉要求。比如经常有人会问,MindManager中的线条可以设置成渐细效果吗?这一点,通过修改主题线条样式,及线条...
  • siweidaotu
  • siweidaotu
  • 2016年12月15日 11:46
  • 561
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:DIV和CSS排版中制作细线条的几种方法
举报原因:
原因补充:

(最多只允许输入30个字)