在手機瀏覽模式下，圖片不能置中！- 藍色小舖 BlueShop

台灣最大程式設計社群網站

∣免費加入會員∣登入 ∣回首頁∣ 您好

線上人數
1192

會員總數：246219
討論主題：189783

登入

登出

歡迎您免費加入會員

討論區選單

開發工具

行動裝置開發

資料庫

多媒體 / 網管

綜合

文章區

討論區列表 >> CSS/HTML5/Bootstarp >> 在手機瀏覽模式下，圖片不能置中！

[]

[我要回覆]

在手機瀏覽模式下，圖片不能置中！
價值 : 10 QP 點閱數:538 回應數:1

樓主

taylortinger

0	1
6	1

發送站內信

想請問這個網站的三張圖片
https://ibuyranking.blogspot.com/p/10-2018.html

在一般電腦網頁瀏覽模式時沒有問題
但只要用手機模式或電腦網頁放大到150%倍左右時
第一和第三張圖就是偏左

code如下

<div class="separator" style="clear: both; text-align: center; margin: 0 auto;">
<a href="https://1.bp.blogspot.com/-Xvp466roM_Y/WzO197SfXfI/AAAAAAAAZNY/2eRh65Gzq_ElsLZEaBqw6LErePQvM8EigCLcBGAs/s1600/%25E8%25BF%259110%25E5%25B9%25B4%25E3%2580%258C%25E5%25A5%25A7%25E6%2596%25AF%25E5%258D%25A1%25E6%259C%2580%25E4%25BD%25B3%25E5%25BD%25B1%25E7%2589%2587%25E3%2580%258D%25EF%25BC%258C%25E7%2584%25A1%25E9%259B%25B7%25E6%258E%2592%25E5%2590%258D%25E5%25A4%25A7%25E5%2585%25AC%25E9%2596%258B.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="私藏近10年，「奧斯卡最佳影片」排名大公開 #無雷 #2018" border="0" data-original-height="995" data-original-width="1572" src="https://1.bp.blogspot.com/-Xvp466roM_Y/WzO197SfXfI/AAAAAAAAZNY/2eRh65Gzq_ElsLZEaBqw6LErePQvM8EigCLcBGAs/s1600/%25E8%25BF%259110%25E5%25B9%25B4%25E3%2580%258C%25E5%25A5%25A7%25E6%2596%25AF%25E5%258D%25A1%25E6%259C%2580%25E4%25BD%25B3%25E5%25BD%25B1%25E7%2589%2587%25E3%2580%258D%25EF%25BC%258C%25E7%2584%25A1%25E9%259B%25B7%25E6%258E%2592%25E5%2590%258D%25E5%25A4%25A7%25E5%2585%25AC%25E9%2596%258B.jpg" title="十大奧斯卡最佳電影排名" /></a></div>

<div class="separator" style="clear: both; text-align: left;">
<a href="https://2.bp.blogspot.com/-lKAKYx5q1ws/WshXqTMAVKI/AAAAAAAAKi8/KShhNd5uCmszQxnCtEwLpidCsP6tzN9RgCLcBGAs/s1600/Moonlight1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="2016年第89届奧斯卡" border="0" data-original-height="1426" data-original-width="1000" src="https://2.bp.blogspot.com/-lKAKYx5q1ws/WshXqTMAVKI/AAAAAAAAKi8/KShhNd5uCmszQxnCtEwLpidCsP6tzN9RgCLcBGAs/s1600/Moonlight1.jpg" title="Moonlight" /></a></div>

<div class="separator" style="clear: both; text-align: center;">
<a href="https://2.bp.blogspot.com/-qVTLPxWyY4c/WzTrIIoTOzI/AAAAAAAAZp8/zaerA58Yg9ooRfg0M_ciI5nniBZf184ggCLcBGAs/s1600/1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="font-family: &quot;microsoft jhenghei&quot; , &quot;helvetica&quot; , sans-serif; font-size: x-large;"><img alt="超便宜日本餐具、碗筷、杯子批發店" border="0" data-original-height="1108" data-original-width="1478" src="https://2.bp.blogspot.com/-qVTLPxWyY4c/WzTrIIoTOzI/AAAAAAAAZp8/zaerA58Yg9ooRfg0M_ciI5nniBZf184ggCLcBGAs/s1600/1.jpg" title="僑俐瓷器" /></span></a></div>

主要差別是第1、3張圖text-align: center
第2張text-align: left

但就是很奇怪為什麼center置左
left反而置中

有換過一三張圖
把center改成left
就會置中

但不希望這樣......
所以我試著在第一張圖後面加margin: 0 auto
情況依然沒有改變

想請問大大們問題是出現哪呢
要如何置中

謝謝

搜尋相關Tags的文章： [ 求助 ] , [ blog ] , [ 網頁問題 ] , [ html ] , [ align ] , [ 圖片置中 ] ,
本篇文章發表於2018-07-03 19:08

1樓

作者回應

taylortinger

已解決
把skin裡相關的css完全刪除就OK

本篇文章回覆於2018-07-03 23:12

== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--

回覆

如要回應,請先登入.