cari

Rumah  >  Soal Jawab  >  teks badan

Bagaimana untuk membuat regangan SVG secara menegak ke sel meja?

Saya mempunyai jadual ringkas dengan SVG dalam sel jadual: 

<html>
<body>
<table style="width: 8em;">
<tr>
<td style="border: 1px solid black;">
<svg viewBox="0 0 1 1" style="width: 1.37em;" preserveAspectRatio="none">
<polyline points="0,0 1,0.5 0,1" style="fill: blue;"></polyline>
</svg>
</td>
<td style="border: 1px solid black;">Lorem ipsum dolor sit amet</td>
</tr>
</table>
</body>
</html>

Seperti yang anda lihat, sel lain dalam baris mungkin terlalu panjang, sekali gus menyebabkan ketinggian baris berubah berbanding lalai, memperkenalkan jurang antara SVG dan sempadan atas dan bawahnya.

Bagaimana untuk membuat SVG secara automatik meregangkan atau mengecut untuk mengisi selnya secara menegak tanpa mengubah dimensi mendatarnya?

P粉521697419P粉521697419477 hari yang lalu524

membalas semua(1)saya akan balas

  • P粉952365143

    P粉9523651432023-09-08 10:12:23

    Satu penyelesaian adalah untuk menjadikannya imej latar belakang. Anda boleh meletakkan kod SVG ke dalam fail yang berasingan atau peratus mengekodkannya untuk digunakan dalam URI data. 

    <table style="width: 8em;">
<tr>
<td style="border: 1px solid black; width: 1.37em; background-image: url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1 1%22 preserveAspectRatio=%22none%22%3E%3Cpolyline points=%220,0 1,0.5 0,1%22 style=%22fill: blue;%22%3E%3C/polyline%3E%3C/svg%3E');"></td>
<td style="border: 1px solid black;">Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet</td>
</tr>
</table>

    balas
    0
  • Batalbalas