经典的css技巧有哪些

发布时间:2021-11-12 15:34:45 作者:iii
来源:亿速云 阅读:89

本篇内容主要讲解“经典的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技巧有哪些”有了更深的了解,不妨来实际操作一番吧!这里是亿速云网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

推荐阅读:
  1. 有哪些经典的CSS面试题
  2. javascript常用的经典技巧分享

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

css

上一篇:如何优化canvas性能

下一篇:Django中的unittest应用是什么

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》