margin-right其实有效果的，只是在默认即标准流的情况的下显示不出来效果。如果脱离标准流呢？想到这个，就立马在css文件中加了一个：float:right;然后在测试的时候就能看到margin-right的效果了。

.style1{

width:400px;

height:440px;

background-color:red;

border:5px solid silver;

margin-top:20%;

margin-right:30%;

} 

<html>

<head>

<link rel="stylesheet" type="text/css" href="mystyle.css">

</head>

<body>

<div class="style1"><img src="bei.jpg"></div>

</body>

</html>

别人的理解：浏览器是默认左对齐的。margin-right其实有效果的，只是在默认即标准流的情况的下显示不出来效果。如果脱离标准流呢？想到这个，就立马在css文件中加了一个：float:right;然后在测试的时候就能看到margin-right的效果了。

我的理解：使用margin-right时，该div的右边到它父div的右边框(或右边div的左边框)的距离大于margin-right所以margin-right的效果被覆盖了。如果距离小于margin-right就会有效果。

用float:left也是不行的，这跟默认的情况是差不多的。

PS：关于right属性无效的原因：right属性只有在position是absolute的情况下才有效，而默认的position值是static，right属性是无效的。建议能不使用right就不要使用right属性。

margin-right没有效果的问题的更多相关文章

  1. 深入学习CSS外边距margin（重叠效果，margin传递效果，margin:auto实现块级元素水平垂直居中效果）

    前言 margin是盒模型几个属性中一个非常特殊的属性.简单举几个例子:只有margin不显示当前元素背景,只有margin可以设置为负值,margin和宽高支持auto,以及margin具有非常奇怪 ...

  2. 利用target的特性，可以实现纯css的tab效果切换

    基础知识: :target起作用的是href连接到的位置 如 <a href="#tab1">tab1</a> <div id="tab1& ...

  3. margin和padding对行内元素的影响

    这个是在面试的时候,面试官问我的一个小问题 自己没有考虑过inline元素设置margin和padding的问题 学习的过程记录下来 1)inline元素的高度是由元素的内容决定的(字体的大小和行高) ...

  4. margin系列之keyword auto

    本系列摘自  px; margin: auto; /* 或者 margin: 0 auto; */ } HTML: <div id="demo"> <p>恩 ...

  5. 我知道你不知道的负Margin

    现如今,负margin技术的应用可谓越来越广,任一个大型站点惊鸿一瞥之下都会有其身影所在.个人认为负margin技术是学习css路上必不可缺少的课题之一,许多高级应用及疑难杂症修复都可以使用负marg ...

  6. CSS深入理解学习笔记之margin

    1.margin与容器尺寸 元素尺寸:①可视尺寸 clientWidth(标准):②占据尺寸 margin与可视尺寸:①适用于没有设定width/height的普通block元素:②只适用于水平方向尺 ...

  7. 详解margin： auto

    auto是margin的可选值之一.相信大家平时使用auto值时,最多的用法大概是 margin: 0 auto; 和 margin: auto; 不过你可能也发现了不论是 margin: auto; ...

  8. android margin--负的margin的使用

    通常情况下,如果我们想要两个控件实现重叠的效果,一般都是使用FrameLayout 或者RelativeLayout布局.其实,如果设置两个控件的margin值为负数,也能实显控件重叠的效果. 先展示 ...

  9. 负margin的原理及应用

    在很多布局中我们经常能够见到类似于margin:-10px;的用法,我们对正值的用法早已熟悉的不能再熟悉了,可是这负值到底有何用呢?听我给你吹. 负margin——普通文档流 普通文档流元素(不浮动, ...

  10. [css]实现垂直居中水平居中的几种方式

    转自博客 http://blog.csdn.net/freshlover/article/details/11579669 居中方式: 一.容器内(Within Container) 内容块的父容器设 ...

随机推荐

  1. 浅谈OC内存管理

    一.基本原理 (一)为什么要进行内存管理. 由于移动设备的内存极其有限,所以每个APP所占的内存也是有限制的,当app所占用的内存较多时,系统就会发出内存警告,这时需要回收一些不需要再继续使用的内存空 ...

  2. 《java入门第一季》之正则表达式小案例

    案例一: 判断手机号码是否满足要求 import java.util.Scanner; /* * * 需求: * 判断手机号码是否满足要求? * * 分析: * 13436975980 * 13688 ...

  3. （八）喜马拉雅Demo引出的细节（代理模式和图片缩放）

    喜玛拉雅是一款电台APP,界面非常美观,通过模仿这一APP学习到很多细节. 1.图片导入后有些框内不全如何补全: 寻常的办法是再准备一张图片拖入,比较好的办法是右击已经导入的图片选择Show in F ...

  4. markdown简易快速的编辑格式（易读易写）

    实现简单快速书写,格式指定简便.易读易写 讲解http://wowubuntu.com/markdown/ 简单使用的讲解:http://www.ituring.com.cn/article/23 代 ...

  5. Java-clone总结

    纸上得来终觉浅,绝知此事要躬行  --陆游    问渠那得清如许,为有源头活水来  --朱熹 clone和Copy:当有一个对象Person p1=new Person("name" ...

  6. 网站论坛同步用户，整合api，实现…

    在网上参考了很多资料后,终于完美实现了网站和discuz!nt论坛的双向整合,整合后网站和论坛之间可以同步注册.登录.退出和修改登录密码操作. 本系统的实现形式是新云CMS网站(ASP)和Discuz ...

  7. gcc学习(二)[第二版]

    头文件与库文件 1.概要 在使用C语言和其他语言进行程序设计的时候,我们需要头文件来提供对常数的定义和对系统及库函数调用的声明. 库文件是一些预先编译好的函数集合,那些函数都是按照可重用原则编写的.它 ...

  8. UML之时序图

            时序图,英文名曰:Sequence Diagram,也称顺序图和序列图,是一种行为图,她通过描述对象之间发送消息的时间顺序显示多个对象之间的动态协作.她可以表示用例的行为顺序,当执行一 ...

  9. SQLServer 基础

    1当设计表时,对表进行结构性的修改(如将原来可以null的改为不可null),直接改则不允许保存修改,需要选择 工具----选项----designers—表设计器和数据库设计器---阻止保持要求重新 ...

  10. obj-c编程07:异常处理

    好了,到了相对轻松的话题,也是所有语言无可避免的话题:异常的处理. 我们知道对于一些常见的语言,"异常"是逃不开避不掉的主题:C中相对原始的signal或依赖系统异常支持(比如wi ...