H5中的定位

这次给大家带来h5中的定位,h5中定位的注意事项有哪些,下面就是实战案例,一起来看一下。

一.定位流分类

1.1相对定位
1.2注意事项
1.3固定定位
1.4静态定位

二.什么是相对定位?

相对定位就是相对于自己以前在标准流中的位置来移动
position: relative;

相对定位注意点

1.相对定位是不脱离标准流的, 会继续在标准流中占用一份空间
2.在相对定位中同一个方向上的定位属性只能使用一个注意事项

注意事项

       .box2{            background-color: green;            position: relative; //相对定位            top: 20px;            left: 20px;            margin-top: 20px;//会加在定位之前的位置上        }

登录后复制

.box2{            background-color: green;            position: absolute; //绝对定位            left: 0;            bottom: 0; //在body的左下角        }

登录后复制

以上就是H5中的定位的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3086609.html

(0)
上一篇 2025年3月28日 07:38:19
下一篇 2025年3月28日 07:38:26

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • html5 viewport总结讲述

    本篇文章是关于HTML5中的HTML5的一个讲述,对于HTML5中viewport不太熟悉的同学,我们可以一起看看本篇文章!来详细的了解一下html5中的viewport 总结下来无非围绕三个问题: 1、为什么要设置虚拟窗口 起初是为了使得…

    编程技术 2025年3月28日
    100
  • 讲讲HTML5中被废弃的标签

    本篇文章讲述了HTML5中被废弃的标签,大家对HTML5中被废弃的标签不了解的话那么我们就一起来看看本篇文章吧, 好了废话少说进入正题吧!切记废弃的html标签最好不要使用哦! 在笔试或者面试中常常会遇到html5新标准的问题,下面是总结的…

    编程技术 2025年3月28日
    100
  • 了解一下HTML5中新增加的标签

     本篇文章讲述了HTML5中新增加的标签,大家对HTML5中新增加的标签不了解的话那么我们就一起来看看本篇文章吧, 好了废话少说进入正题吧! 在笔试或者面试中常常会遇到html5新标准的问题,如新增了哪些新标签,api,或者干脆问新增了哪些…

    编程技术 2025年3月28日
    100
  • 详解HTML5 表单属性

    今天本文主要和大家详细介绍HTML5的表单属性,需要的朋友可以参考下,希望能帮助到大家。 表单事件: oninput:当用户输入的时候触发。oninvalid:当验证未通过时触发。 demo.html: nbsp;html>Docum…

    编程技术 2025年3月28日
    100
  • 关于HTML5的知识小结

    本文给大家带来关于HTML5的知识小结,需要的朋友可以参考下,希望能帮助到大家。下面跟随小编一起来看一下吧。 一:移动开发知识点 一. 使用rem作为单位   html { font-size: 100px; }  @media(min-w…

    编程技术 2025年3月28日
    100
  • HTML5联合canvas实现图片压缩

    这次给大家带来html5联合canvas实现图片压缩,主要以代码的形式体现,下面就是实战案例,一起来看一下。 nbsp;html>   lianxi        登录后复制 button  var file = document.q…

    编程技术 2025年3月28日
    100
  • HTML5实现拖拽功能步骤详解

    这篇文章主要介绍了HTML5实现拖拽功能步骤详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧 问题:突然奇想,想在电影网上加一个收藏(类似于购物车的东西),可以通过拖拽图片进行添加 前提:需要了解HTML5中…

    编程技术 2025年3月28日
    100
  • 实例详解Html5的背景应用

    这篇文章主要介绍了浅谈Html5的背景属性,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧 1、背景属性复习:background-imagebackground-colorbackground-repeatba…

    2025年3月28日
    100
  • HTML5的video标签操作视频详解

    这次给大家带来HTML5的video标签操作视频详解,HTML5的video标签操作视频的视频有哪些,下面就是实战案例,一起来看一下。 在现在对于网站制作的研究中,各方面的人员使用没有停止过,一直在不停的专研,其中HTML5的使用就是很大的…

    编程技术 2025年3月28日
    100
  • H5+C3+JS实现楼层跳跃特效

    这次给大家带来H5+C3+JS实现楼层跳跃特效,H5+C3+JS实现楼层跳跃特效的注意事项有哪些,下面就是实战案例,一起来看一下。 楼层跳跃式的页面布局 *{ margin: 0; padding: 0; } body, html{ hei…

    编程技术 2025年3月28日
    100

发表回复

登录后才能评论