1. 程式人生 > 其它 >css文字圖片按鈕環繞

css文字圖片按鈕環繞

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    .text
{ display: -webkit-box; -webkit-line-clamp: 3; width: 200px; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.5em; } .text button { float: right; clear: left; } .text img { float: left; clear: right; } .text::before{ content: ''; float: left; width: 1px; background-color
: red; height: 50px; } </style> </head> <body> <div class="text"> <img src="" alt="暫無"> <button>1</button><button>1</button> 浮動元素是如何定位的 正如我們前面提到的那樣,當一個元素浮動之後,它會被移出正常的文件流,然後向左或者向右平移,一直平移直到碰到了所處的容器的邊框,或者碰到另外一個浮動的元素。 </div> </body> </html>

在這裡插入圖片描述