分享一个悬浮于父级底部且水平居中+底部边距可调的div布局,div中两行一行是向下的箭头,一行是"查看更多",所有都用行内样式
<div style="position: fixed; bottom: 15vh; left: 50%; transform: translateX(-50%); text-align: center; background-color: #333; color: white; padding: 10px 20px; border-radius: 10px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="50" height="50">
<path d="M6 9l6 6 6-6" fill="none" stroke="white" stroke-width="1"/>
</svg>
<!--stroke-width= 设置了线条厚度 -->
<div style="font-size: 14px; font-weight: bold; margin-top: -10px;">More Product Details</div>
</div>