百分百源码网-让建站变得如此简单! 登录 注册 签到领金币!

主页 | 如何升级VIP | TAG标签

当前位置: 主页>网站教程>CSS教程> CSS尺寸的百分比
分享文章到:

CSS尺寸的百分比

发布时间:09/01 来源:未知 浏览: 关键词:
CSS中的百分比盘算办法CSS支撑多种单位情势,如百分比、px、pt、rem等,百分比和px是常用的单位,随着挪移端和相应式的流行,rem、vh、vw也开端普及运用。

CSS中的单位

绝对单位

in-英寸;

cm;

mm;

pt-磅

相对单位

em-与元素字号挂钩;

rem-与根元素字号挂钩;

px-与css像素挂钩

%-另一属性值的百分比

CSS中可以取百分比的属性

定位:top, right, bottom, left

盒模型:width,height, margin,padding

配景:backgroug-position, backgroud-size

文本:text-indent

字体:font-size

百分比是怎样盘算的

百分比的盘算是相对一个基数的,这个基数与目前元素的包括块有关。

基于包括块的宽度来盘算的属性:margin, padding, width, max-width,min-width, left, right, text-indent.

基于包括块的高度来盘算的属性:top,bottom,height,max-height,min-height

基于目前字体大小来盘算的属性:line-height

基于line-height来盘算的属性:vertical-align

基于元素自身的宽高:background-position:配景图像的位置,离别设定水平标的目的和垂直标的目的上的两个值,要是运用百分比,那么百分比值会同时利用于元素和图像。例如 50% 50% 会把图片的(50%, 50%)这一点与框的(50%, 50%)处对齐,相当于设定了 center center。同理 0% 0% 相当于 left top,100% 100% 相当于 right bottom

基于元素自身的宽度:background-size但此值只能利用在块元素上,所设定百分值将运用配景图片大小依据所在元素的宽度的百分最近盘算

举荐教程:《CSS教程》

以上就是CSS 尺寸的百分比的细致内容,更多请关注 百分百源码网 其它相干文章!

打赏

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

百分百源码网 建议打赏1~10元,土豪随意,感谢您的阅读!

共有151人阅读,期待你的评论!发表评论
昵称: 网址: 验证码: 点击我更换图片
最新评论

本文标签

广告赞助

能出一分力是一分吧!

订阅获得更多模板

本文标签

广告赞助

订阅获得更多模板