行内非替换元素span, display的方式为inline(默认)
*{padding:0px;margin:0px;}
p{background:gray;position:relative;left:100px;top:100px;}
p span{}
</style>
</head>
<body>
<p>
<span>12312312</span>
</p>
显示如下:
对p设置padding:padding:10px ,上下左右都有效果
对span设置padding: p span{padding:20px;} 只对左右有效果
对span设置margin: p span{margin:20px;} 只对左右有效果
行内替换元素img, display的方式为inline(默认)
*{padding:0px;margin:0px;}
p{background:gray;position:relative;left:100px;top:100px;}
p img{}
</style>
</head>
<body>
<p>
<img src = "links.png"/>
</p>
显示效果如下:
对img设置padding: p img{padding:20px;} 对上下左右都有效果
对img设置margin: p imgmargin:20px;} 对上下左右都有效果,同上