部落格嵌入非YT影片版面跑位01

在寫我終於成功用特效把我媽變成灰姑娘啦這篇時，被困很久的竟然是影片嵌入後，手機版面跑位的問題！媽咪自首目前仍是CSS語法幼幼班(*´艸`*)，雖然最後有成功把問題解決，但覺得可以更好，因此決定把過程記錄下來，也希望知道答案的朋友們能跟寶貝家分享，我們會非常感激的！本篇主要以部落格嵌入Bilibili影片來記錄。

 

部落格嵌入非YT影片

在詢問專業的建議後，我們把影片的大小從絕對值改為百分比，這瞬間就解決了手機版面的問題，不過，這次換電腦版跑位了！幾經測試之後，給大家猜猜看，哪一個選項才終於測試成功？

 

  • A.寬高都設定絕對值
  • B.寬高都設定百分比
  • C.寬設定百分比，高設定絕對值
  • D.寬設定絕對值，高設定百分比

答案：(C)

▾部落格嵌入Bilibili影片

 

部落格嵌入非YT影片-實驗

▾A.寬高都設定絕對值：電腦版OK，但手機版跑位了。
2.都用絕對值.png

 

▾B.寬高都設定百分比：手機版OK，但電腦版跑位了。雖然手機版OK，但若彈幕沒有關閉會擋到視頻。
3.都用百分比.png

 

▾C.寬用百分比，高用絕對值：手機電腦都成功！
4.寬用百分比+高用絕對值.png

 

▾D.寬用絕對值，高用百分比：手機電腦都跑位，ㄟ害！
5.寬用絕對值+高用百分比.png

 

部落格嵌入非YT影片-補充

影片尺寸中百分比和絕對值裡的數值是可調整的。

 

 

部落格嵌入Facebook影片

▾部落格嵌入Facebook影片測試結果：
若希望手機和電腦版面都正常呈現的話，仍是C.寬設定百分比，高設定絕對值。

 

 

以上是寶貝簡單的實驗
如果有記錄錯誤的地方
或是有更好的解決方式
還請不吝指教唷^^

希望您喜歡寶貝的文章
也希望您可以幫寶貝
按火箭20次
留言支持
轉發分享
非常感謝您

延伸閱讀

幸福人生

★ 如果您最近運勢不佳、睡眠品質不好，
或是有被鬼壓床的困擾，
推薦您試試看循環播放驅魔禱告，
讓地藏王菩薩幫助您
驅離邪靈惡鬼騷擾。

★ 如果您的身體狀況不佳、體虛多病，
推薦您經常播放抗癌禱告，
讓地藏王菩薩幫助您
身體健康、擺脫惡疾。

★ 如果您是自營工作者，或是公司的負責人，
推薦您經常播放發財禱告，
讓地藏王菩薩幫助您
生意興隆、財運亨通、客人絡繹不絕。

＊使用電腦版Youtube，可以直接在影片上按右鍵點『循環播放』

arrow
arrow
    文章標籤
    部落格嵌入影片 部落格嵌入FB影片 部落格嵌入Bilibili影片 天界之舟佛法正宗 天界之舟行善濟世 寶貝問路
    全站熱搜

    寶貝問路 發表在 痞客邦 留言(3) 人氣()