前端笔记十，大小定位轮廓相关属性
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了前端笔记十，大小定位轮廓相关属性相关的知识，希望对你有一定的参考价值。
大小相关属性
height:用于设置对象的高度
max-height:设置对象的最大高度，如果该属性值小于min-height属性值，则自动转换为min-height的属性值
min-height:设置对象的最小高度
width:设置对象宽度
max-width:设置对象的最大宽度
min-width:设置对象的最小宽度
box-sizing属性：设置width,height控制哪些区域的宽度、高度；可使用值
content-box:设置的width,height控制元素的内容区的宽度和高度（只有内容区）
padding-box:设置的width,height控制元素内容区和内补丁区的宽度和高度（内补丁区及以内）
border-box:设置的width,height控制元素内容区、内补丁区和边框区的宽度和高度（边框区及以内）
resize属性：设置是否允许用户通过拖动来改变元素的大小，支持以下属性值
none:不允许拖动
both:允许拖动来改变高度和宽度
horizontal:允许拖动来改变组件的宽度
vertical:允许拖动来改变组件的高度
inherit:继承父类的resize属性，默认值
resize对所有指定了overflow属性的组件有效
定位相关属性
position:用于设置目标对象的定位方式，可选值：
absolute:允许将该对象漂浮于页面之上，无需考虑它周围内容的布局
relative:目标对象的位置将参照前一个对象的位置进行定位,如基于之前的最后一行文本进行定位
static:仅以页面作为参照系
z-index:设置目标对象的漂浮层的层序，该值越大，漂浮层越浮在上面；仅当position为relative或者absolute时有效，对窗口控件无效，如<select>
top:设置目标对象相对于最近一个具有定位设置的父对象的顶边偏移；仅当position为relative或者absolute时有效
right:设置目标对象相对于最近一个具有定位设置的父对象的右边偏移；仅当position为relative或者absolute时有效
bottom:设置目标对象相对于最近一个具有定位设置的父对象的底边偏移；仅当position为relative或者absolute时有效
left:设置目标对象相对于最近一个具有定位设置的父对象的左边偏移；仅当position为relative或者absolute时有效
轮廓相关属性：主要用于让目标对象周围有一圈“光晕”效果
outline:复合属性，全面设置目标对象轮廓的颜色、线型、线宽三种属性
outline-color:设置组件的轮廓颜色
outline-style:设置轮廓线型
outline-width:设置轮廓宽度
outline-offset:设置轮廓偏移距
以上是关于前端笔记十，大小定位轮廓相关属性的主要内容，如果未能解决你的问题，请参考以下文章