iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > html >css中常见margin用法有哪些
  • 405
分享到

css中常见margin用法有哪些

2024-04-02 19:04:59 405人浏览 八月长安
摘要

小编给大家分享一下CSS中常见margin用法有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!margin 1、margi

小编给大家分享一下CSS中常见margin用法有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

margin

1、margin-left
设置对象左外边距
margin-left:10px; ——设置左外边距10px

2、margin-right
设置装备摆设对象右外边距
margin-right:20px; ——设置装备摆设右外边距20px

3、margin-top
设置装备摆设对象上外边距
margin-top:15px ——设置上外边距15px

4、margin-bottom
配置对象下外边距
margin-bottom:30px ——设置下外边距30px

以上抗衡div,css抉择器里东西须要配置外边距。

下列为常见缩写使用

5、margin:0
配置对象margin的上、左、下、右间距均为0

6、margin:0 auto
配置对象高下外边距为0,支配为自动,此属性常用对象水准居中,譬喻div居中,对div设置装备摆设margin:0 auto,同时不要配置float,就可以让此div居中了。

7、margin:10px 20px
设置装备摆设对象高低外边距10px、左右外边距20px

8、margin:10px 15px 20px 25px
设置对象上外边距10px、右外边距15px、下外边距20px、左外边距25px

9、margin:10px 20px 30px
配置对象上外边距10px、支配外边距20px、下外边距为30px

10、margin:10px;margin-left:0
如果对象同时配置margin:10px;margin-left:0,那么代表先对对象上、下、左、右外边距均配置10px,左边零丁再配置0,收尾相当于对象上、下、右为10px,左为0。

第10点属于手腕性应用。

以上是“css中常见margin用法有哪些”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注编程网html频道!

--结束END--

本文标题: css中常见margin用法有哪些

本文链接: https://www.lsjlt.com/news/95462.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • css中常见margin用法有哪些
    小编给大家分享一下css中常见margin用法有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!margin 1、margi...
    99+
    2024-04-02
  • CSS中margin和padding的常用方法有哪些
    本篇内容主要讲解“CSS中margin和padding的常用方法有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“CSS中margin和padding的常用方法有哪些”吧!一、padding1...
    99+
    2023-07-04
  • margin-top失效常见症状有哪些
    这篇文章给大家分享的是有关margin-top失效常见症状有哪些的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。关于margin-top失效的解决方法常出现两种情况:(一)marg...
    99+
    2024-04-02
  • 在HTML中使用CSS的常见方法有哪些
    这篇文章主要讲解了“在HTML中使用CSS的常见方法有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“在HTML中使用CSS的常见方法有哪些”吧!层叠样式...
    99+
    2024-04-02
  • CSS中常见的布局有哪些
    这篇文章主要讲解了“CSS中常见的布局有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CSS中常见的布局有哪些”吧! CSS...
    99+
    2024-04-02
  • CSS中有哪些常见的布局
    这篇文章将为大家详细讲解有关CSS中有哪些常见的布局,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。   1、常见的单列布局:   header,content和foo...
    99+
    2024-04-02
  • css中常见的单位有哪些
    css中常见的单位有:px:绝对单位,在页面中是按照精确的像素来展示em:相对单位,基准点为父节点字体的大小,若是自身定义了font-size则按自身来计算rem:相对单位,相对根节点html的字体大小来计算vw:viewpoint wid...
    99+
    2024-04-02
  • css中margin属性有哪些值
    css 中的 margin 属性值有四种:1. auto(根据父元素和兄弟元素尺寸自动计算);2. length(指定具体长度值);3. percentage(相对父元素宽度或高度的百分...
    99+
    2024-04-28
    css
  • css常见问题有哪些
    小编给大家分享一下css常见问题有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!1. CSS 中 inline 元素可以设置...
    99+
    2024-04-02
  • 常见CSS错误有哪些
    这篇文章将为大家详细讲解有关常见CSS错误有哪些,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。代码如下:区别IE6与FF: background:orange;*background:blue; 区别IE...
    99+
    2023-06-08
  • CSS常见技术有哪些
    这篇文章主要介绍了CSS常见技术有哪些的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇CSS常见技术有哪些文章都会有所收获,下面我们一起来看看吧。1、介绍一下标准的 CSS 的盒...
    99+
    2024-04-02
  • c++中vector常见用法有哪些
    这篇文章主要讲解了“c++中vector常见用法有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“c++中vector常见用法有哪些”吧!1、c++ 中 vectorvector有两个参数...
    99+
    2023-06-25
  • DIV常见用法有哪些
    这篇文章主要介绍了DIV常见用法有哪些,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。1.启用div作为编辑器 让div进入编辑状态很简单,只需要: 代码如下:div.cont...
    99+
    2023-06-08
  • Dnsmasq常见用法有哪些
    这篇文章将为大家详细讲解有关Dnsmasq常见用法有哪些,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。Dnsmasq为小型网络提供网络基础设施:DNS,DHCP,路由器通告和网络引导。它被设计为轻量级且占...
    99+
    2023-06-27
  • Shell常见用法有哪些
    这篇文章主要为大家展示了“Shell常见用法有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“Shell常见用法有哪些”这篇文章吧。shell的简单使用最近发现shell脚本在平常工作中简直算...
    99+
    2023-06-09
  • 有哪些常见的css框架
    这篇文章给大家介绍有哪些常见的css框架,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。1.Bootstrap基于HTML、CSS、JavaScript 开发的简洁、直观、强悍的前端开发框架,使得 Web 开发更加快捷。...
    99+
    2023-06-14
  • C++中vector的常见用法有哪些
    C++中vector的常见用法包括: 创建vector:可以通过声明一个vector对象并指定元素类型,或者通过拷贝或移动已有v...
    99+
    2023-10-26
    C++ vector
  • CSS常见的技巧有哪些
    本篇内容主要讲解“CSS常见的技巧有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“CSS常见的技巧有哪些”吧!如何清除图片下方出现几像素的空白间隙? 代码如下:方法1: img{displa...
    99+
    2023-06-08
  • css中常见的loding效果实现方法有哪些
    这篇文章主要为大家展示了“css中常见的loding效果实现方法有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“css中常见的loding效果实现方法有哪些...
    99+
    2024-04-02
  • SQLNET.ORA的常见用法有哪些
    这篇文章主要讲解了“SQLNET.ORA的常见用法有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“SQLNET.ORA的常见用法有哪些”吧!一、IP 黑...
    99+
    2024-04-02
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作