• wordpress CMS主题:ssmay主题wordpress CMS主题:ssmay主题
  • 首页 > HTML5与CSS3.0 > CSS3常规使用(3):CSS盒模型

    CSS3常规使用(3):CSS盒模型

    作者: 分类:HTML5与CSS3.0 点击: 211 次
    wordpress CMS主题:ssmay主题

      1、处理溢出 overflow

      overflow-x 水平溢出
      overflow-y 垂直溢出

      overflow: auto 浏览器自行处理溢出内容。如果有溢出内容,就显示滚动条。
      overflow: hidden 如果有溢出的内容,直接剪掉。
      overflow: scroll 不管是否溢出,都会出现滚动条。
      overflow: visible 默认值,不管是否溢出,都显示内容。

      2、元素可见性 visibility

      visibility: visible 默认值,元素在页面上可见。
      visibility: hidden 元素不可见,但会占据空间。
      visibility: collapse 元素不可见,隐藏表格的行与列,如果不是表格,则和 hidden 一样。

      3、元素盒类型

      块级元素:就是能够设置元素尺寸、隔离其他元素功能的元素。比如:<div>、<p>等文档元素。

      行内元素:不能设置元素尺寸,只能自适应内容、无法隔离其他元素,其它元素会紧跟其后。如:<span>、<b>、<a>等文本元素。

      行内-块元素:可以设置元素尺寸,但无法隔离其他元素的元素。比如<img>。

      注:可以互换,行内元素添加 display:block; 就可以变成块级元素。

      4、display

      display: block 盒子为块级元素
      display: inline 盒子为行内元素
      display: inline-block 盒子为行内-块元素
      display: none 盒子不可见,不占位

      5、颜色和透明度

      opacity 设置元素的透明度,值是 0到1的数,如:

      opacity:0.8;

      6、盒子阴影和轮廓 box-shadow

      box-shadow: 5px 4px 10px 2px gray inset;

      水平偏移量,垂直偏移,模糊值,阴影延伸半径,颜色,设成内阴影
      前2个参数是必须的,后4个是可选的。

      7、以在边框的外围再加一层 outline

      outline: 10px double red; 在边框的外围再增加一圈轮廓。

      8、光标样式 :

      cursor:pointer; 手形;
      cursor:move 十字;
      cursor:help 问号



      QQ二维码

    文章作者:hero2018
    本文地址:http://wanlimm.com/77201807256159.html
    版权所有 © 转载时必须以链接形式注明作者和原始出处!

    上一篇:
    下一篇:
    wordpress CMS主题:ssmay主题

    或许你会感兴趣的文章:

    发表评论

    电子邮件地址不会被公开。 必填项已用*标注

    This site uses Akismet to reduce spam. Learn how your comment data is processed.