制作1PX高的DIV

最新推荐文章于 2011-07-08 14:30:24 发布
最新推荐文章于 2011-07-08 14:30:24 发布
阅读量527 收藏
点赞数
分类专栏： 结构与样式 文章标签： div 面试 class css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/trace332/article/details/1833984
版权

在蓝色上看到过这个教程,淘宝的面试题也有这一题.所以开始感兴趣了.

   原理如下:默认层的最小高度是字体高度,所以一般情况下是无法制作出1PX高的DIV的.(为什么要做1PX的DIV?闲的吧?晕)

既然如此,就可以修改字体大小font-size,CSS如下:

.aaa{ height:1px;width:300px;background:#CC0000;margin:0;padding:0; font-size:1px;line-height;1px;}

<div class="aaa"></div>

 另一种方法是使用over-flow:hidden隐藏多出来的部分.

trace332
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
div和css制作斜线示例分享
12-13
提示要注意两点：1、DIV宽高的定义。2、DIV在 IE6 中默认是有高度的。 上图右边是我们要实现的效果，代码如下： 复制代码代码如下:<div id=”box”></div> <p><style type=”text/css”>#box{width:0px; ...
HTML DIV+CSS制作通栏实例
09-25
总结来说，这个HTML DIV+CSS制作通栏实例展示了如何使用HTML布局和CSS样式来创建一个具有通栏效果的网页，包括页头、导航菜单、主要内容区域和页脚。通过合理地使用`<div>`标签和CSS属性，我们可以灵活地控制网页的...
CSS去除表格的默认间距并且制作1px的细线表
12-29
现在在所谓“div css”的风气下，很多人放弃了表格，其实应该让每个标签物尽其用，在表现数据的地方，我们还是应该使用table。但是，我们在建立table的时候，会发现它会具有一些默认的样式，比如单元格td之间会有...
JavaScript 制作div圆角
01-07
font-size:1px;\ }\ .tl {\ left:-' + borderRadius + 'px;\ top:-' + borderRadius + 'px;\ }\ .tr {\ right:-' + borderRadius + 'px;\ top:-' + borderRadius + 'px;\ }\ .bl {\ left:-' + ...
div+css制作圆角矩形的原理示例解读
09-25
`rtop`和`rbottom`中的四个div（`r1`、`r2`、`r3`、`r4`）的宽度和高度都设置为1像素，通过调整它们的外边距（margin）来形成不同的圆角弧度。例如，`r1`的外边距比`r2`大，因此在视觉上`r1`会比`r2`更接近中心，...
CSS_td标签中的colspan
trace的技术备忘专栏
05-05 5697
最近做了一些表单,内容很多,在td标签中使用了不少的colspan,测试后发现有些问题.        比如在CSS中定义好td { width:80px;},这样一个的格子width应该是240px.填写一些内容,在FF中是正常的,浏览器会智能地把这个td当成三个打通了的格子.但IE中就惨了,浏览器把这个colspan = 3的格子依旧认作一个格子,文字到了80px的地方就会自动换行了.
CSS_解决IE6中min-width问题
trace的技术备忘专栏
05-05 4453
参考资料:http://www.webreference.com/programming/min-width/index.html IE6中的min-width无效,而实际上,这是一个很好很有用的属性. 怎么解决呢? 参考资料中的方法其实也很麻烦,需要添加两个空div标签. 一个是设置一个大的边框宽度[ border-left: 300px solid #fff;
CSS_input 垂直居中
trace的技术备忘专栏
06-03 4262
input 垂直居中总是有问题，查了资料，好像说是按照里面文字的底线对齐来居中的。网上的解决方法是：对input 使用vertical-align:middle;
一个Web IM的UI练习
trace的技术备忘专栏
07-08 2841
一个Demo。只完成了html+css部分，还没来及添加交互的js以及更多想法是用websocket做个后台  html - 云起
HTMLCSS_form表单
trace的技术备忘专栏
03-28 1745
最常用的表单结构：用户名请输入用户名密码性别 男
CSS_淘宝页面上一些圆角的做法
trace的技术备忘专栏
05-30 1514
 看了看淘宝一些页面上的圆角是如何制作的.发现有一部分是直接做成完整的图片(固定宽度),有些则是多余标签+四个角的图片来做. 从FF中边查看边摘出第二种方法的代码  h4h4h4 bdbdbdbd h4h4h4 bdbd
CSS_自适应按钮
trace的技术备忘专栏
09-15 1191
看了别人的自适应按钮，感觉这不就是滑动门么？呵呵 ，算了，记下来方便以后查阅 CSS：  body { font-family:Verdana,sans-serif; font-size:12px; } a{ background:url(img/call_button_right.jpg) no-repeat right top; display:
CSS_em与strong的区别
trace的技术备忘专栏
05-30 975
看了"岁月如歌"的文章,自己总结一下: EM: Indicates emphasis. //表明重点STRONG: Indicates stronger emphasis. //表明更加重视  em更突显句意,而strong则更突显重要性(突出视觉效果,表明和别的词不一样哦).em会改变句意,strong则不会. 文章中的例子不错,可以看一下.Cats are cu
CSS_一个常用分页样式
trace的技术备忘专栏
09-19 772
<br /><br /> <br />直接上代码：<br /> <br /> <br /> <br /> <ul class="pager"> <li class="page prev"> <a href="#" mce_href="#"> < </a> </li> <li class="page cur"> <a href="#" mce_href="#">1</a> </li> <li class="page"> <a href="#" mce_hr
CSS_圆角_无图片圆角代码
trace的技术备忘专栏
11-05 732
一个无图片圆角代码例子 /* 块级元素 */.c_title, .c_title h2 {font-size:14px;}.c_title {background-color:#D5F1FF;color:#00527B;height:100%;line-height:23px;overflow:hidden;padding:2px 10px 0;
CSS_IE6边框残缺BUG
trace的技术备忘专栏
05-22 715
表现状况：窗口的边框时隐时现。。。发生情况：      网上说是在一个容器中有元素浮动时容易出现，自己感觉有时内部元素把容器撑开时也会看不到边框。 解决办法：      如果按网上说的是因为浮动的原因的话，那么添加清除浮动则应试可以正常解决。     另外网上的解决办法是：给窗口设置{zoom:1} or { width:100%; height:100%}使其拥有布局即可
CSS_png图片格式
trace的技术备忘专栏
06-03 677
虽然也不太懂，但只记住切片的时候，切成PNG8的透明图片是可以被IE6支持的。 PNG8 - 支持透明，无损格式，体积最小，但最多只支持256色。栅格影像最好不要选择这种格式做cache。PNG24 - 除了png8的有点，理论上可以存储2的24次方种颜色。但ie6之前的版本对此格式兼容有问题。PNG32 - 除了上述的优点，可以被所有的浏览器很好的支持，但产生的文件体积相对较大。
CSS_水平导航条
trace的技术备忘专栏
03-21 638
首  页 走进中科创 投资中心 担保中心 政策法规 新闻动态 人才招聘 联系我们   #mainNav ul{ float:left;/*alert:添加浮动后,IE/FF中导航条长短不一致的BUG消失*/ margin:0; padding:0; list-style-type:none; wid
读ghost的页面模块化设计
trace的技术备忘专栏
06-14 569
模块化是指解决一个复杂问题时自顶向下逐层把软件系统划分成若干模块的过程。每个模块完成一个特定的子功能，所有的模块按某种方法组装起来，成为一个整体，完成整个系统所要求的功能。模块具有以下几种基本属性：接口、功能、逻辑、状态，功能、状态与接口反映模块的外部特性，逻辑反映它的内部特性。在软件的体系结构中，模块是可组合、分解和更换的单元。
制作一个大小为10*10px的div，样式是什么
最新发布
06-01
可以使用CSS来为一个大小为10*10px的div设置样式，样式如下： ```css div { width: 10px; height: 10px; background-color: #000; } ``` 上面的CSS代码设置了div元素的宽度为10px，高度为10px，背景色为黑色。...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值