overflow-x水平方向内容溢出时的设置 overflow-y垂直方向内容溢出时的设置 以上三个属性设置的值为visible(默认值)、scroll、hidden、auto。
2.scrollbar-3d-light-color立体滚动条亮边的颜色(设置滚动条的颜色)
scrollbar-arrow-color上下按钮上三角箭头的颜色 scrollbar-base-color滚动条的基本颜色 scrollbar-dark-shadow-color立体滚动条强阴影的颜色 scrollbar-face-color立体滚动条凸出部分的颜色 scrollbar-highlight-color滚动条空白部分的颜色 scrollbar-shadow-color立体滚动条阴影的颜色 86oo精彩教程
@ div层级结构?
1、定位
定位:
1、普通流定位
普通流,又称为文档流
块级元素:从上到下一个一个的排列
行内元素:一行内从左到右的排列
2、浮动定位
1、什么是浮动定位
将元素排除在普通流之外,即脱离文档流
浮动元素不会占据页面空间
浮动元素会放置在"包含框"的左边或右边
浮动元素依旧位于包含框之内
浮动元素可以向左或向右浮动,直到碰见包含框的边缘或另一个已浮动的元素框为止
2、特点
1、浮动元素边缘不会超过其父元素的边缘
2、浮动元素不会重叠
3、浮动只能左右浮动,不会上下浮动
注意:非块级元素浮动的话,那么将会变成块级元素,允许修改 width 和 height
3、处理问题
1、让块级元素在同一行内显示
2、修改行内元素的 width 和 height
4、浮动属性
属性:float
取值:
none
left
right
清除浮动所带来的影响:
属性:clear
取值:left
right
both
5、子级元素的浮动,为父层元素所带来的影响
如果一个元素的所有子级内容都是浮动的,那么它的高度会变成 0
解决方案
1、设置父容器高度
2、设置父元素的 overflow:hidden;
3、在父元素中,增加一个空元素,添加clear:both;
2、显示方式
1、display
none:生成元素没有框,不占据页面空间,隐藏
block:按块级显示
inline:按行内方式显示
inline-block:行内块,所有的元素在一行内显示,允许修改width 和 height
使用场合:
1、控制元素的显示与隐藏
隐藏:display:none;
显示:
块级 :display:block
行内 :display:inline
2、将行内元素变成块级 或 行内块
目的:修改行内元素的宽和高
2、显示效果
1、visibility
可见性
取值:
visible :默认值,可见的
hidden :元素不可见,占据页面空间
collapse :用在表格上
问题:visibility:hidden 与 display:none的区别
2、opacity
透明度
取值:0 – 1
opacity:0.5;
3、vertical-align
垂直方向对齐
td
img
取值:
baseline : 默认,基线对齐
top : 顶部对齐
bottom :底部对齐
middle :居中对齐
放在img 上,控制的是 img 左右两端文本的垂直对齐方式
4、光标
改变鼠标的显示效果
属性:cursor
取值:
default
pointer :小手
crosshair :+
text : I
wait : 等待
help : ?
@ 响应式和自适应的区别?
自适应:
在不同分辨率下不同设备上显示相同的页面。即:根据屏幕的宽度,自动调节网页内容的大小,使其主体内容和布局不变。
响应式:
响应式的概念应该是覆盖了自适应,但是包括的东西更多了。响应式布局可以根据屏幕的大小自动的调整页面的展现方式,以及布局。
(1)允许网页的宽度自动的调整
(2)尽量少使用绝对的宽度,多点百分比
(3)相对大小的字体:字体不要使用px写死,最好使用相对大小的em,或者高清方案rem,这个不限制与字体,别的属性也可以这么设置
(4)流式布局,float等float的好处是,如果宽度太小,放不下两个元素,后面的元素会自动滚动到前面元素的下方,不会在水平方向overflow(溢出),避免了水平滚动条的出现。
(5)选择加载css,<link rel="stylesheet" type="text/css" media="screen and (max-device-width: 400px)" href="tinyScreen.css" />,这个意思是如果屏幕宽度小于400像素(max-device-width: 400px),就加载tinyScreen.css文件。
@ div添加滚动条?
div 加滚动条的两种方法:
一、
<div overflow-y:auto; overflow-x:auto; width:400px; height:400px;”></div>
记住宽和高一定要设置噢,否则不成的
这样比较好的是,在宽和高不超出时,只是一条线
三、说明
直接为div指定overflow属性为auto即可,但是必须指定div的高度,如下:
<div>
</div>
如果要出现水平滚动条,则: overflow-x:auto
同理,垂直滚动条为: overflow-y:auto
如果该div被包含在其他对象例如td中,则位置可设为相对:position:relative