其他样式

Posted 2020-10-15 黑山大胖子

其他样式

　　1.display，直译为显示，表示元素的显示方式

　　　　block，块状的显示方式

　　　　none，元素不显示，即隐藏。这里的隐藏式不占位置的，即元素会消失。

　　2.visibility，直译为可见性，表示元素可见与否，

　　　　visible，默认，元素为可见，

　　　　hidden，元素为隐藏。这里的隐藏式元素不可见，元素的位置依然保留。

　　3.overflow，直译为溢出，表示超出元素的内容的处理方式，

　　　　visible，默认，显示

　　　　hidden，隐藏，超出元素的部分不再显示，

　　　　scroll ，显示滚动条，超出元素的部分会添加滚动条在元素内滚动显示。

　　4.透明效果，opacity:0.5;-moz-opacity:0.5;filter:alpha(opacity=50)

　　　　后两个代码用于声明在不同浏览器中的兼容，

　　　　0.5和50表示透明度是50%，值越大透明度越高。

　　5.圆角效果，border-radius:5px;

　　　　表示设置的圆角的半径是5像素，

　　　　可以设置正方形元素圆角半径大于等于其边长的一半来画圆，

　　　　可以单独设置元素某一个角的圆角，如border-bottom-left-radius:5px;，位左下角的圆角为5像素。

　　6.阴影效果，box-shadow:0 0 5px white;

　　　　第一个值表示阴影的水平移动，正值为向右移，负值为向左移，

　　　　第二个值表示阴影的垂直移动，正值为向下移，负值为向上移，

　　　　第三个值表示阴影的扩散大小，

　　　　第四个值表示阴影的颜色。

　　　　还可以添加的值inset，表示阴影是向元素内扩散的。