static:默认值
absolute:脱离文档结构,导致父元素坍塌;相对于最近的非static元素进行定位;使得inline元素被“块”化;使得元素已有的float失效。多个悬浮元素,后来者在上方;
relative:根据原来位置,导致自身位置的相对变化,而不会影响其他元素的位置、大小的变化。
产生新的定位上下文,影响子元素(如absolute属性元素定位)
fixed:根据浏览器确定位置
参考文章:https://www.cnblogs.com/wangfupeng1988/p/4322680.html
css原理:
vertical-align :指定行内元素(inline)和行内块级元素(inline-block)或表格单元格(table-cell)元素的垂直对齐方式。
文本垂直居中:
单行文本:设置line-height 和区域高度height 一致即可
多行文本垂直居中:
1、父级元素高度不固定,随内容变化:内填充padding-top = padding-bottom
2、父级元素高度固定:
父元素div:display:table
子元素div:display:table-cell;vertical-align:middle
子div垂直居中:
1、子div具体大小设置偏移
2、利用transform:translateX(-50%)translateY(-50%)
3、利用绝对布局absolute
4、利用vertical-align属性实现子div大小不固定垂直居中
5、利用display:flex:
justify-content: center/*实现水平居中*/
align-items:center/*实现垂直居中*/
参考链接:https://blog.csdn.net/u014607184/article/details/51820508
通过这样的Css样式就可以实现:
<div style="margin:0 autowidth:200px">
<input class="submit" id="btn" type="submit" value="注册" />
</div>
使用margin-left:automargin-right:auto可以让你的div居中对齐。
.style{margin-left:automargin-right:auto} 缩写形式为: .style{margin:0 auto} ,数字0 表示上下边距是0。
后面的那个width也是个很重要的属性,因为按钮的宽度非常小,所以要设置一个合适的width值才可以让按钮居中。
扩展资料
css中margin属性用法:
margin简写属性在一个声明中设置所有外边距属性。该属性可以有1到4个值。格式为-margin:10px 5px 15px 20px
实例:
1、margin:10px 5px 15px 20px
上边距是 10px,右边距是 5px,下边距是 15px,左边距是 20px;
2、margin:10px 5px 15px
上边距是 10px,右边距和左边距是 5px,下边距是 15px;
3、margin:10px 5px
上边距和下边距是 10px,右边距和左边距是 5px;
4、margin:10px
所有四个边距都是 10px。