免費論壇 繁體 | 簡體
Sclub交友聊天~加入聊天室當版主
分享
新浪微博
QQ空间
Facebook
Google+
Plurk
Twitter
Line
Board logo

標題: 文字垂直对齐位置 [打印本頁]
作者: rainbow    時間: 2013-10-24 17:09     標題: 文字垂直对齐位置

本帖最後由 rainbow 於 2021-1-7 15:15 編輯

文字垂直置中
  1. <center><img src="图片网址" align="absmiddle"><span style="font-size:30pt;color:#7C4E13;font-family:隶书;font-weight:bold">文字垂直置中</span></center>
複製代碼




文字垂直置顶
  1. <center><img src="图片网址" align="top"><span style="font-size:30pt;color:#7C4E13;font-family:隶书;font-weight:bold">文字垂直置顶</span></center>
複製代碼




文字垂直置底
  1. <center><img src="图片网址" align="bottom"><span style="font-size:30pt;color:#7C4E13;font-family:隶书;font-weight:bold">文字垂直置顶</span></center>
複製代碼


作者: rainbow    時間: 2014-6-10 15:12     標題: 图片位置

本帖最後由 rainbow 於 2021-1-7 15:19 編輯

文字垂直置中
  1. <center>
  2. <img src="图片网址" style="vertical-align:middle;" /><span style="font-size:30pt;color:#7C4E13;font-family:隶书;font-weight:bold">文字垂直置中</span>
  3. </center>
複製代碼




文字垂直置顶
  1. <center>
  2. <img src="图片网址" style="vertical-align:top;" /><span style="font-size:30pt;color:#7C4E13;font-family:隶书;font-weight:bold">文字垂直置顶</span>
  3. </center>
複製代碼




http://2img.net/h/img
㈠
  1. <center>
  2. <img src="图片网址" /><span style="font-size:30pt;color:#7C4E13;font-family:隶书;font-weight:bold">文字垂直置底</span>
  3. </center>
複製代碼


㈡
  1. <center>
  2. <img style="vertical-align:text-bottom" src="图片网址" /><span style="font-size:30pt;color:#7C4E13;font-family:隶书;font-weight:bold">文字垂直置底</span>
  3. </center>
複製代碼


作者: rainbow    時間: 2014-6-10 16:44

本帖最後由 rainbow 於 2021-5-24 09:53 編輯
 
 
大 标 题
文字……。
 
 
  1. <center>
  2. <div style="width:800px">
  3. <table border="0" cellspacing="0" cellpadding="0" width="100%" align="center">
  4. <tbody>
  5. <tr>
  6. <td style="width:30px" valign="top"><img src="http://www.qiao-you.com/Attachments/fckfiles/201305/20130522_085448_154.gif" /></td>
  7. <td style="height:"80px" background="http://www.qiao-you.com/Attachments/fckfiles/201305/20130522_084850_164.gif">&nbsp;</td>
  8. <td style="width:30px" valign="top"><img src="http://www.qiao-you.com/Attachments/fckfiles/201305/20130522_085553_178.gif" /></td>
  9. </tr>
  10. <tr>
  11. <td style="width:30px">&nbsp;</td>
  12. <td style="width:740px">
  13. <div style="width:740px" align="center">
  14. <table bgcolor="#e1dcdf" width=100%>
  15. <tbody>
  16. <tr>
  17. <td>
  18. <center>
  19. <div style="filter:shadow (color=#000000, strength=20); width:100%; font-weight:bold; font-size:60pt; color:#8e3e6d; line-height:150%; font-family:SimHei">大 标 题</div></center>
  20. <div style="padding-left:20px; padding-right:20px; FONT-SIZE:16pt; COLOR:#592744; LINE-HEIGHT: 150%; FONT-FAMILY: 宋体; font-weight: bold" align=left>文字……。</div>
  21. <p align=center><img src="http://www.qiao-you.com/Attachments/fckfiles/201401/20140126_092306_115.gif" /></p>
  22. </tr>
  23. </tbody>
  24. </table>
  25. </div>
  26. </td>
  27. <td style="width:30px">&nbsp;</td>
  28. </tr>
  29. <tr>
  30. <td style="width:30px" valign="bottom"><img src="http://www.qiao-you.com/Attachments/fckfiles/201305/20130522_085448_154.gif" /></td>
  31. <td style="height:80px" background="http://i62.tinypic.com/kmd7c.gif">&nbsp;</td>
  32. <td style="width:30px" valign="bottom"><img src="http://www.qiao-you.com/Attachments/fckfiles/201305/20130522_085553_178.gif" /></td>
  33. </tr>
  34. </tbody>
  35. </table>
  36. </div>
  37. </center>
  38. <br><br>
複製代碼


作者: rainbow    時間: 2015-1-1 15:42

<br><br>
<center>
<div style="width:800px" align="center">
<table cellspacing="40" cellpadding="0" width="100%" background="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverbackgroundall.jpg">
<tbody>
<tr>
<td width="100%">

<div align="center">
<table border="0" cellspacing="15" cellpadding="0" width="100%" background="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverstripdark.jpg">
<tbody>
<tr>
<td width="100%">

<div align="center">
<table border="0" cellspacing="8" cellpadding="0" width="100%" background="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverstriplight.jpg">
<tbody>
<tr>
<td width="100%">

<div align="center">
<table cellspacing="15" cellpadding="0" width="100%" background="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverstriplarge.jpg">
<tbody>
<tr>
<td width="100%">

<div align="center">
<table border="0" cellspacing="0" cellpadding="20" width="100%" background="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverbackground.jpg">
<tbody>
<tr>
<td width="100%">

<center>
<div style="width:70%" align="center">
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tbody>
<tr>
<td width="10%">
<p align="center"><img src="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverheart.gif" /></p></td>
<td valign="bottom" width="80%"><p align="center"><img style="filter:flipH" src="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverhearts.gif" /><img src="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverhearts.gif" /></p></td>
<td width="10%"><p align="center"><img src="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverheart.gif" /></p></td>
</tr></tbody></table></div></center>

<p align="center"><img style="width:500px" src="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/forevertop.jpg" /></p>

<center>
<div style="width:90%" align="center">
<table border="5" cellspacing="15" bordercolorlight="#101b1a" bordercolordark="#406865" cellpadding="0" width="100%" background="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverbackground.jpg">
<tbody>
<tr>
<td width="100%">

<div align="center">
<table border="5" bordercolorlight="#406865" bordercolordark="#101b1a" cellspacing="5" width="100%" background="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverstripdark.jpg">
<tbody>
<tr>
<td width="100%">

<div align="center">
<table border="0" cellspacing="10" cellpadding="0" width="100%" background="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverstriplarge.jpg">
<tbody>
<tr>
<td width="100%">

<div align="center">
<table border="0" cellspacing="0" cellpadding="0" width="100%" background="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverbackground.jpg">
<tbody>
<tr>
<td width="100%">
<p align="center"><img style="filter:flipH" src="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverdaisy.jpg" />&nbsp;<img src="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverdaisy.jpg" /></p>
</td></tr></tbody></table></div>
</td></tr></tbody></table></div>
</td></tr></tbody></table></div>
</td></tr></tbody></table></div></center>

<p align="center"><img src="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverguestbookimage.jpg" /></p>

<p align="center"><img src="http://lospecchiomagico.altervista.org/Leggende%20popolari%20italiane/04%20Veneto/01%20Il%20melo/foreverbar.jpg" /></p>
</td></tr></tbody></table></div>
</td></tr></tbody></table></div>
</td></tr></tbody></table></div>
</td></tr></tbody></table></div>
</td></tr></tbody></table></div>
</td></tr></tbody></table></div>
</center>
<br><br>
作者: rainbow    時間: 2015-1-1 15:42     標題: 代碼多了一套table的關閉碼的效果

本帖最後由 rainbow 於 2015-1-7 16:18 編輯
代碼多了一套table的關閉碼的效果：
（注意帖子下面回復欄版面的顔色變化）

 







歡迎光臨 老校友 (http://boanson.orzweb.net/) Powered by Discuz! 7.2