一、使用CSS的定位属性
在HTML中，元素的定位可以使用CSS的position属性来实现。position属性有四个值：static、relative、absolute和fixed。其中，static为默认值；relative相对于元素的正常位置进行定位；absolute相对于最接近的已定位祖先元素进行定位，若不存在已定位的祖先元素，则以HTML页面为基准进行定位；fixed相对于浏览器窗口进行定位，即便页面滚动，元素仍会固定在窗口的相应位置。使用这些属性对元素进行定位，要结合top、bottom、left、right属性一起使用来确定元素的位置。
/* relative定位 */
div {
position: relative;
left: 50px;
top: 50px;
}
/* absolute定位 */
div {
position: absolute;
left: 0;
top: 0;
}
/* fixed定位 */
div {
position: fixed;
top: 0;
right: 0;
}
二、使用浮动
在HTML中，可以使用CSS的float属性将元素浮动起来，这样可以改变元素的默认位置，并且允许其他元素围绕它进行排列。使用浮动元素实现布局时，可以结合clear属性来控制浮动的方向。clear属性有三个值：left、right和both，分别表示不允许左浮动元素、右浮动元素和两者同时存在。
/* 左浮动 */
div {
float: left;
}/* 结合clear使用 */
.clearfix:after {
content: "";
display: block;
clear: both;
}左浮动元素1
原创文章，作者：CRCMF，如若转载，请注明出处：https://www.506064.com/n/329401.html
微信扫一扫 
支付宝扫一扫 