关注前端开发
关注用户体验

几个经典的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%;
}

使块元素水平居中

margin:0 auto;

其实就是

margin-left: auto;
margin-right: auto;

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

body{
text-align: center;
}

然后定义内层容器

text-align: left;

恢复。

隐藏 Exploer textarea 的滚动条

textarea {
overflow:auto;
}

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

设置打印分页

h2 {
page-break-before:always;
}

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

删除链接上的虚线框

a:active, a:focus {
outline:none;
}

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

赞(0)
未经允许不得转载:大前端 » 几个经典的css技巧
分享到: 更多 (0)

评论 14

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
  1. #10

    It’s best to participate in a contest for probably the greatest blogs on the web. I will recommend this web site!

    Joan Thro2周前 (03-13)回复
  2. #9

    Considering someone which is aware of reports, nonetheless is not going to discover how they can travel jointly? Maybe you are just a friend or relative that doesn’t have the time that will relax and property and additionally lb . available words on the key board.

    Timothy Skewis2周前 (03-11)回复
  3. #8

    Ever thought about what separates a great coach and mentor from the rest? And why great coaches get results while other get frustrated? “The biggest MISTAKE most people make about a coach is: They mistake a COACH for a BABY SITTER A BABY SITTER tells kids in a nice way that they need to do what they are told to do in a soft and caring voice as to not upset the child. A great baby sitter will smile when the child is throwing a tantrum. A COACH on the other hand is hired to get the best out of a person. They are not there to smile and tell a person what they want to hear. They are hired to get a result because they care about outcomes and getting the most out of a person. A great coach does not play stupid games with irresponsible people who think they want to get the best from themselves yet fail to show it in their actions. This is why great coaches Drop average players from their team all the time. When ADULTS hire a coach, it is not the coaches responsibility to do the work, run the laps or sweat. That’s what the player does. Coaches see how the player can best suit the game and find their unique talents and gifts, then put them in a position to win. If the player fails to turn up, then a good coach will drop the lazy, irresponsible player in turn for the player with a good attitude who is prepared to put in the work to succeed. Next time you are thinking about hiring a coach, just remember the best coaches drop lazy, irresponsible players all the time as they value their years of hard work, learning the art of what they coach and pride themselves on success. If you want to be a great player in the game of life or business; action, implementation and great communication is the key. “Make shit happen”. Great coaches love great clients or great players on their team.

    Eileen Holthus2周前 (03-08)回复
  4. #7

    ABLEnding, Inc. has the ability to accommodate the funding for home purchases, refinancing, construction loans, home equity lines of credit, and commercial loans in Arizona. As a mortgage broker, Mark Ventrone works with lenders from all over the country – not just one – so you know you’ll always get the absolute lowest rates and fees and best product available for your particular situation. Getting a mortgage can be quite confusing, but Mark will PERSONALLY guide you through every step of the process providing excellent customer service, responding to most emails and calls. Looking for a mortgage brokers in Arizona, contact ABLEnding, Inc or call (602)362-6634 for more details.

    Claud Prigmore3周前 (03-07)回复
  5. #6

    РharmaEurope.net sells real legit anabolic steroids. All their stuff is authentіc andd of very hіgh quality –
    here you cаn buy testosterone, anadrol, trenbоlone, human growth hormone, cytomel, T3, and moгe without prescription

  6. #5

    BᥙlkPһarma.net sells real legit anabolic sterߋids.

    All theiг stuff is authentіc and of very high quаlity

    here ʏou ⅽann buy testosterone, anadrol, trenbolone, human growth hormone, cytomel, T3,
    and more withοut prescription

    bionabol prices1个月前 (02-21)回复
  7. #4

    You will never win

    Lakewood CA dentist8年前 (2011-03-25)回复
  8. #3

    Pretty good post. I just stumbled upon your blog and wanted to say that I have really enyed reading your blog posts. Any way I’ll be subscribing to your feed and I hope you post again soon

    how to get pregnant8年前 (2011-02-16)回复
  9. #2

    Excellent post. I was checking constantly this blog and I am impressed! Extremely helpful info particularly the last part 🙂 I care for such information a lot. I was seeking this certain info for a long time. Thank you and best of luck.

    Carlton Sheets8年前 (2011-01-11)回复
  10. #1

    Hi – very great site you have made. I enjoyed reading this posting. I did want to write a comment to tell you that the design of this site is very aesthetically sweet. I used to be a graphic designer, now I am a copy editor for a newspaper firm. I have always enjoyed functioning with computing machines and am attempting to learn code in my free time (which there is never enough of lol).

    wow schools review8年前 (2011-01-08)回复

themebetter 国内更好的WordPress主题服务商

立即前往