css 定位
2021-04-11 22:27
标签：布局 height 知识 移动 set 粉丝 one absolute 存在 css 定位概念 CSS 为定位和浮动提供了一些属性，利用这些属性，可以建立列式布局，将布局的一部分与另一部分重叠，还可以完成多年来通常需要使用多个表格才能完成的任务。 1，相对定位 相对于一个元素的正常位置来对其定位。 2，绝对定位 使用绝对值来对元素进行定位。 3，浮动 浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。 由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样。 css 定位 标签：布局 height 知识 移动 set 粉丝 one absolute 存在 原文地址：https://www.cnblogs.com/yx3445/p/12405623.html本节知识点练习作业
DOCTYPE html>
html lang="en">
head>
meta charset="UTF-8">
title>Titletitle>
style type="text/css">
*{
margin: 0;
}
div.xddw{
position:relative;
bottom: 27px;
}
a.cdl{
font-size: 14px;
text-decoration: none;
margin-left: 5px;
margin-top: 3px;
margin-bottom: 3px;
color: darkgrey;
}
a.xddw2{
font-size: 16px;
color: black;
position: relative;
top: 54px;
text-decoration:;
}
style>
head>
body>
div style="border-bottom: 1px solid #cccccc;height:27px;">
a href="" class="cdl">首页a>
a href="" class="cdl">新闻a>
a href="" class="cdl">找找看a>
a href="" class="cdl">学习计划a>
div>
div class="xddw" style="height: 130px;width: 1000px;margin-right: auto;margin-left: auto;border-bottom: 1px solid #cccccc">
a href="" class="xddw2">园子a>
a href="" class="xddw2">关注a>
a href="" class="xddw2">粉丝a>
a href="" class="xddw2">随便看看a>
a href="" class="xddw2">消息a>
p style="position: relative;top: 88px;font-size: 18px;">strong>欢迎您，欲心！strong>p>
img src="jinritoutiao%20logo.png" alt="" style="height: 45px;position: absolute;left: 685px;top:50px">
img src="bokeyuan%20logo.png" alt="" style="height: 50px;position: relative;left: 700px;top: 60px">
div>
div style="height: 160px;width: 1000px;margin-right: auto;margin-left: auto;">
img src="bj.png" alt="" style="height: 160px;width: 1000px;">
div>
div style="height: 30px;width: 1000px;margin-left: auto;margin-right: auto;border-bottom: 3px solid black">
img src="01.jpeg" alt="" style="height: 150px;position: absolute;bottom: 600px;left:500px;border-radius: 50%">
div>
body>
html>