博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
17 , CSS 区块、浮动、定位、溢出、滚动条
阅读量:5122 次
发布时间:2019-06-13

本文共 3131 字,大约阅读时间需要 10 分钟。

1.CSS 中区块的使用

2.CSS 中浮动的使用

3.CSS 中定位的使用

4.CSS 中溢出的使用

5.CSS 中滚动条的使用

 

17.1 CSS 中区块的使用

属性名称 属性值 说明

width 像素/百分比 区块的宽度

auto

height 像素/百分比 区块的高度

auto

min-height 像素像素/百分比 区块最小高度

auto

max-height 像素像素/百分比 区块最大高度

auto

min-width 像素像素/百分比 区块最小宽度

auto

max-width 像素像素/百分比 区块最大宽度

auto

17.2 CSS 中浮动的使用

属性名称 属性值 说明

float none 正常显示

left 左浮动

right 右浮动

clear none 允许两边浮动

left 不允许左边浮动

right 不允许右边浮动

both 不允许两边浮动

17.3 CSS 中定位的使用

属性名称 属性值 说明

position relative 设置区块基准点为左上角

absolute 设置网页的为基准点左上角

static 无设置

left auto 以基准点定位在左边

像素/百分比 定位在左边

top auto 以基准点定位在上边

像素/百分比 定位在上边

right auto 以基准点定位在右边

像素/百分比 定位在右边

bottom auto 以基准点定位在下边

像素/百分比 定位在下边

z-index auto 自动调整高度

数字 数字越大越往上层

17.4 CSS 中溢出的使用

属性名称 属性值 说明

overflow visible 不剪切内容也不添加滚动条

auto 在必需时对象内容才会被

裁切或显示滚动条

hidden 不显示超过对象尺寸的内容

scroll 总是显示滚动条

overflow-x (同上)

overflow-y (同上)

17.5 CSS 中滚动条的使用

属性名称 属性值 说明

scrollbar-3dlight-color 颜色/十六进制 滚动条亮边框

scrollbar-highlight-color 颜色/十六进制 滚动条 3D 界面亮边

scrollbar-face-color 颜色/十六进制 滚动条 3D 表面

scrollbar-arrow-color 颜色/十六进制 滚动条方向箭头

scrollbar-shadow-color 颜色/十六进制 滚动条 3D 暗边

scrollbar-darkshadow-color 颜色/十六进制 滚动条暗边框

scrollbar-base-color 颜色/十六进制 滚动条基准颜色

scrollbar-track-color 颜色/十六进制 滚动条的拖动区域

1CSS 中区块的使用

无标题文档
	CSS 中区块的使用属性名称 属性值 说明width 像素/百分比 区块的宽度		autoheight 像素/百分比 区块的高度		automin-height 像素像素/百分比 区块最小高度		automax-height 像素像素/百分比 区块最大高度		automin-width 像素像素/百分比 区块最小宽度		automax-width 像素像素/百分比 区块最大宽度		auto

 

  2浮动

无标题文档
	 CSS 中浮动的使用属性名称 属性值 说明float none 正常显示		left 左浮动		right 右浮动clear none 允许两边浮动		left 不允许左边浮动		right 不允许右边浮动		both 不允许两边浮动

  31相对定位

相对定位,设置区块基准点为左上角
我是相对定位,设置区块基准点为左上角
	CSS 中定位的使用属性名称 属性值 说明position relative 设置区块基准点为左上角			absolute 设置网页的为基准点左上角			static 无设置left auto 以基准点定位在左边		像素/百分比 定位在左边top auto 以基准点定位在上边		像素/百分比 定位在上边right auto 以基准点定位在右边		像素/百分比 定位在右边bottom auto 以基准点定位在下边		像素/百分比 定位在下边z-index auto 自动调整高度		数字 数字越大越往上层

  32绝对定位

我是绝对定位,设置网页的为基准点左上角
我是绝对定位,设置网页的为基准点左上角

  32绝对定位案例

无标题文档
www.szwzjs.com
www.szwzjs.com
www.szwzjs.com
www.szwzjs.com
www.szwzjs.com
www.szwzjs.com

  41溢出

无标题文档
CSS 中溢出的使用属性名称 属性值 说明overflow visible 不剪切内容也不添加滚动条auto 在必需时对象内容才会被裁切或显示滚动条hidden 不显示超过对象尺寸的内容scroll 总是显示滚动条overflow-x (同上)overflow-y (同上)

CSS 中溢出的使用属性名称 属性值 说明overflow visible 不剪切内容也不添加滚动条auto 在必需时对象内容才会被裁切或显示滚动条hidden 不显示超过对象尺寸的内容scroll 总是显示滚动条overflow-x (同上)overflow-y (同上)
CSS 中溢出的使用属性名称 属性值 说明overflow visible 不剪切内容也不添加滚动条auto 在必需时对象内容才会被裁切或显示滚动条hidden 不显示超过对象尺寸的内容scroll 总是显示滚动条overflow-x (同上)overflow-y (同上)
CSS 中溢出的使用属性名称 属性值 说明overflow visible 不剪切内容也不添加滚动条auto 在必需时对象内容才会被裁切或显示滚动条hidden 不显示超过对象尺寸的内容scroll 总是显示滚动条overflow-x (同上)overflow-y (同上)
	CSS 中溢出的使用属性名称 属性值 说明overflow visible 不剪切内容也不添加滚动条				auto 在必需时对象内容才会被				裁切或显示滚动条				hidden 不显示超过对象尺寸的内容				scroll 总是显示滚动条overflow-x (同上)overflow-y (同上)	

  42滚动条的使用

无标题文档
我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师我是柳志军老师

  

 

转载于:https://www.cnblogs.com/liu-zhijun/p/10628283.html

你可能感兴趣的文章
微服务例举
查看>>
Jquery效果代码--(二)
查看>>
linux查看占用内存/cpu最高的进程情况
查看>>
OO第四次博客作业
查看>>
【译】《Pro ASP.NET MVC4 4th Edition》第二章(一)
查看>>
<ItemTemp>里写判断语句
查看>>
Urllib库的基本用法
查看>>
关于Linux字符集的查看及修改
查看>>
Centos7下shell脚本添加开机自启动
查看>>
Spring AOP:自动注入参数值
查看>>
Python30个基础题(二)
查看>>
深搜的剪枝技巧
查看>>
对 makefile 中 .DEFAULT 的理解
查看>>
spring quartz定时任务
查看>>
JS正则练习集
查看>>
ViewPager 可左右滑动和缩放的图片浏览
查看>>
ITTC微博数据挖掘--在线演示Sliverlight版本
查看>>
软技能--代码之外的生存指南
查看>>
二维动态数组问题
查看>>
poj 2065 SETI
查看>>