千家信息网

经典的css技巧有哪些

发表于:2025-01-16 作者:千家信息网编辑
千家信息网最后更新 2025年01月16日,本篇内容主要讲解"经典的css技巧有哪些",感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习"经典的css技巧有哪些"吧!经典的css技巧使用line-heigh
千家信息网最后更新 2025年01月16日经典的css技巧有哪些

本篇内容主要讲解"经典的css技巧有哪些",感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习"经典的css技巧有哪些"吧!

  经典的css技巧

  使用line-height垂直居中

  line-height:24px;

  使用固定宽度的容器并且需要一行垂直居中时,使用line-height即可(高度与父层容器一致)。

  清除容器浮动

  #main{

  overflow:hidden;

  }

  期前也提到过这样的问题。

  不让链接折行

  a{

  white-space:nowrap;

  }

  上面的设定就能避免链接折行,不过个人建议长链接会有相应的这行(有关换行方面的讨论,参看圆心的记录)。

  始终让Firefox显示滚动条

  html{

  overflow:-moz-scrollbars-vertical;

  }

  更多的Mozilla/Firefox私有CSS属性可以参考这里。需跨浏览器的支持,也可以使用

  body,html{

  min-height:101%;

  }

  css技巧有什么

  使块元素水平居中

  margin:0auto;

  其实就是

  margin-left:auto;

  margin-right:auto;

  这个技巧基本上所有的CSS教科书都会有说明,别忘记给它加上个宽度。Exploer下也可以使用

  body{

  text-align:center;

  }

  然后定义内层容器

  text-align:left;

  恢复。

  隐藏Exploertextarea的滚动条

  textarea{

  overflow:auto;

  }

  Exploer默认情况下textarea会有垂直滚动条(不要问我为什么)。

  设置打印分页

  h3{

  page-break-before:always;

  }

  page-break-before属性能设置打印网页时的分页。

  删除链接上的虚线框

  a:active,a:focus{

  outline:none;

  }

  Firefox默认会在链接获得焦点(或者点击时)加上条虚线框,使用上面的属性可以删除。

到此,相信大家对"经典的css技巧有哪些"有了更深的了解,不妨来实际操作一番吧!这里是网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

0