html+css学习笔记009-定位

Mr. 柳上原

发布于 2018-09-05 15:12:54

7440

发布于 2018-09-05 15:12:54

文章被收录于专栏：菜鸟前端工程师

Author：Mr.柳上原

付出不亚于任何的努力
愿我们所有的努力，都不会被生活辜负
不忘初心，方得始终

重感情的人总是被伤害

重感情的人害怕改变

重感情的人总想自己的爱人、朋友、同事都能好好的

重感情的人，狠不下心去批评别人的错误

重感情的人，总是想无限制的去包容身边的人

重感情的人，其实只是希望大家都好

只是太过于包容

却让身边的人习惯了纵容的滋味

最后的结果，却总是和愿望相反

最后，一切的不是，一切的坏，都是自己承担

<!DOCTYPE html> <!-- 文档类型：标准html文档 -->

<html lang='en'> <!-- html根标签 翻译文字：英文 -->

<head> <!-- 网页头部 -->

<meat charset='UTF-8'/> <!-- 网页字符编码 -->

<meat name='Keywords' content='关键词1,关键词2'/>

<meat name='Description' content='网站说明'/>

<meat name='Author' content='作者'/>

<title>前端59期学员作业</title> <!-- 网页标题 -->

<link rel='stylesheet' type='text/css' href='css/css1.css'/> <!-- 外链样式表 -->

<style type='text/css'> /*内部样式表*/

position:relative /* 定位：
static 默认，不属于定位
relative 相对定位，相对于元素本身进行定位
absolute 绝对定位，需要参考对象，参考对象为最近的非static的父级定位，没有父级定位参考body
fixed 固定定位，参考浏览器窗口

定位偏移量：
top 顶部偏移量
bottom 底部偏移量
right 右边偏移量
left 左边偏移量

定位特征：
static 没有任何影响
relative 如果不给偏移量不会有任何影响，不会脱离文档流
absolute 完全脱离文档流，支持宽高，支持margin，padding，默认内容撑开宽度，margin:auto，float失效
fixed 与absolute一致

层级：
z-index适用于定位元素，数值越大层级越高，可以为负值

过度：
transition:attr time;
attr 过度属性 all默认
time 过度时间 s秒 ms毫秒
*/

</style>

</head>

<body> <!-- 网页主干：可视化区域 -->

<div id='wrap' class='wrap'>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</div>

</body>

</html>

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2018.05.25 ，如有侵权请联系 cloudcommunity@tencent.com 删除

html