PTT
Submit
Submit
選擇語言
正體中文
简体中文
PTT
Web_Design
[問題] 圖片隨文字高度等比縮放
作者:
mate99
(kkk)
2021-07-31 17:02:08
如標題所述
在同一列上面左邊欄位的文字行數會隨後端傳遞的資料多寡,高度會改變,
文字欄位跟圖片欄位寬度比例是2:1,因為儲存的圖片大小不一,
希望右欄圖片可依照左邊文字欄位行數的高度,來自動等比例縮放且置中
請問該怎麼寫CSS來達成這個功能.
以下附上測試的程式碼片段.
<div class='row'>
<div class='col-8'>
{% for item in content %}
<p>{{item}}</p>
{% endfor %}
</div>
<div class='col-4'>
<img src={% static picture %}>
</div>
</div>
作者: sjensen (KwonIn)
2021-08-02 03:07:00
只變高度嗎?這樣圖片怎麼會比例轉變?不知道把width設定好60%40%可不可行,要看文字區塊內容打算怎麼處理,目前想到word-wrap或是flex應該都好處理。圖片置中也可以用flex操作。
作者:
Rplus
(R+) (9527)
2021-08-02 16:37:00
定好容器寬,img 用 object-fit 處理
繼續閱讀
[問題] wordpress 佈景主題自訂頁面異常
lostinspace
[問題] 在f12下修改沒反應
tree581
[請益] wordpress 更新後掛了
chiaoru
Re: [問題] Wordpress訪客與網站的互動外掛
b831003ge
[閒聊] Vtuber 閒聊網頁前端技術的事 【網頁前端座談會】
hedgehogs
[問題] Wordpress訪客與網站的互動外掛
SanderYun
[問題] Django註冊表單CSS排版問題
khsjds
[請益] 請推薦我Wordpress站內搜尋外掛
SanderYun
[問題] 主機商問題和選擇
befdawn
[問題] 客製化一個網站大概需要多少錢?
waterice0902
Links
booklink
Contact Us: admin [ a t ] ucptt.com