亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

已經將img大小設定了,為什么media-body部分內容不左移動?

<!DOCTYPE?HTML>
<html>
<head>
<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8">
<title>媒體對象--媒體對象列表</title>
<link?rel="stylesheet"?>
</head>
<body>
<ul?class="media-list">
????<li?class="media">
???????//這里我給img設定了寬度變小,可是瀏覽器顯示效果僅僅是將圖片變小了,可是右邊文字部分還沒有左移
?<a?class="pull-left"><img?style="width:55%;"?
src="http://a.disquscdn.com/uploads/users/3740/2069/avatar92.jpg?1406972031"></a>
????????<div?class="media-body">
????????????<h4?class="media-heading">我是大漠</h4>
????????????<p>這種方法的實現對圖片是有要求的,如果圖片比較大從效果上看是沒任何作用的</p>
????????</div>
????</li>
????<li?class="media">
????????<a?class="pull-left"><img??src="http://tp2.sinaimg.cn/3306361973/50/22875318196/0"></a>
????????<div?class="media-body">
????????????<h4?class="media-heading">慕課網</h4>
????????????<p>這種方法的實現對圖片是有要求的,如果圖片比較大從效果上看是沒任何作用的</p>
????????</div>
????</li>
????<li?class="media">
????????<a?class="pull-left"><img?src="http://tp4.sinaimg.cn/1167075935/50/22838101204/1"></a>
????????<div?class="media-body">
????????????<h4?class="media-heading">W3cplus</h4>
????????????<p>這種方法的實現對圖片是有要求的,如果圖片比較大從效果上看是沒任何作用的</p>
????????</div>
????</li>
</ul>
??<script?src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
??<script?src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>?
</body>
</html>

第一個li里面的img,我給設定了寬度變小至55%,可是瀏覽器顯示效果僅僅是將圖片變小了,可是右邊文字部分還沒有左移

正在回答

5 回答

你如果想中間的10px不要,也很簡單,因為pull-left,原本就是向做浮動,現在這個pull-left在media中就個給他添加了一個向右的外邊距,如下media > .pull-left {?margin-right: 10px;};那現在就很明白了,你直接取消pull-left,然后直接在后面寫一個樣式?style="float:left" 就可以了

0 回復 有任何疑惑可以回復我~

還有為什么圖片和文字中間有間隙,因為

.media > .pull-left {
?margin-right: 10px;
}
.media > .pull-right {
?margin-left: 10px;
}

每個media-object中的<a>標簽都加了pull-right或者還是pull-left,然后有10px的外邊距

0 回復 有任何疑惑可以回復我~

你的好好學一下什么是,行內元素,什么是塊級元素,你對一個行內元素設寬度,當然不行了

0 回復 有任何疑惑可以回復我~

http://img1.sycdn.imooc.com//585917870001305e06250214.jpg

@Slience丶 ? ? ? ? 我的意思是那個頭像縮小后怎么出現了紅框所示那么大一段間隙。? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?


0 回復 有任何疑惑可以回復我~

將第一個a標簽的pull-left改成pull-right

0 回復 有任何疑惑可以回復我~
#1

湯姆家的魚 提問者

我問的是怎么去掉圖片與文字之間的空隙,如下圖,并不是將頭像右浮動。謝謝你的回答。
2016-12-20 回復 有任何疑惑可以回復我~

舉報

0/150
提交
取消

已經將img大小設定了,為什么media-body部分內容不左移動?

我要回答 關注問題
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號