ホームページ >ウェブフロントエンド >htmlチュートリアル >HTML 表示インラインブロック 问题_html/css_WEB-ITnose
我想用html+CSS 实现图上功能,于是用了inline-block。图中文字分为4块,问题是我输入的文字在同一块中无法换行,一旦我用0c6dc11e160d3b678d68754cc175188a,就会文字不出现,代码如下:
47eabecc5a4cd172f9cb299731b3ed23
53b05fdf370d8f8b53d78fba712eb263 #块1
Singapore0c6dc11e160d3b678d68754cc175188a
53 Cantonment Road #02-000c6dc11e160d3b678d68754cc175188a
16b28748ea4df4d9c2150843fecfba68
f60b881be035bab9fbcfea2e492530d3 #块2
Malaysia0c6dc11e160d3b678d68754cc175188a
Suite 2A-5-1, Block 2A, Plaza Sentral0c6dc11e160d3b678d68754cc175188a
16b28748ea4df4d9c2150843fecfba68
53641fc92cf72d9f935f97e9f6f678a5 #块3
12, place de La Défenseff9d32c555bb1d9133a29eb4371c1213
Maison de La Défenseff9d32c555bb1d9133a29eb4371c1213
16b28748ea4df4d9c2150843fecfba68
53641fc92cf72d9f935f97e9f6f678a5 #块4
Room 315, Kim Nam Venture Buildingff9d32c555bb1d9133a29eb4371c1213
Binjiang Districtff9d32c555bb1d9133a29eb4371c1213
16b28748ea4df4d9c2150843fecfba68
16b28748ea4df4d9c2150843fecfba68
不好意思,代码贴错了,下面是我用的代码
47eabecc5a4cd172f9cb299731b3ed23
f60b881be035bab9fbcfea2e492530d3 #块1
Singapore0c6dc11e160d3b678d68754cc175188a
53 Cantonment Road #02-000c6dc11e160d3b678d68754cc175188a
16b28748ea4df4d9c2150843fecfba68
92ed69daa8a0b2dd49e03cf7308301c1 #块2
Malaysia0c6dc11e160d3b678d68754cc175188a
Suite 2A-5-1, Block 2A, Plaza Sentral0c6dc11e160d3b678d68754cc175188a
16b28748ea4df4d9c2150843fecfba68
80940d55d11ea5d85af9d514fa1de1f1 #块3
12, place de La Défenseff9d32c555bb1d9133a29eb4371c1213
Maison de La Défenseff9d32c555bb1d9133a29eb4371c1213
16b28748ea4df4d9c2150843fecfba68
53b05fdf370d8f8b53d78fba712eb263 #块4
Room 315, Kim Nam Venture Buildingff9d32c555bb1d9133a29eb4371c1213
Binjiang Districtff9d32c555bb1d9133a29eb4371c1213
16b28748ea4df4d9c2150843fecfba68
16b28748ea4df4d9c2150843fecfba68
试一试 e388a4556c0f65e1904146cc1a846bee94b3e26ee717c64999d7867364b1b4a3,如果还是不行的话,估计是你的盒太小了,把你的CSS贴出来看看。
试一试 e388a4556c0f65e1904146cc1a846bee94b3e26ee717c64999d7867364b1b4a3,如果还是不行的话,估计是你的盒太小了,把你的CSS贴出来看看。
为什么不用display:table- cell和display:table-row
试一试 e388a4556c0f65e1904146cc1a846bee94b3e26ee717c64999d7867364b1b4a3,如果还是不行的话,估计是你的盒太小了,把你的CSS贴出来看看。
<!DOCTYPE html><html lang="en"> <head> <meta charset="utf-8"> <title>Carousel Template · Bootstrap</title> <style type="text/css"> .box{ width: 700px; height: 300px; border: 1px solid gray; } tr{ height:100px; text-align: left; } td{ width:350px; } </style> </head> <body> <div class="box"> <table> <tr> <th>Contact Us</th> </tr> <tr> <td> Singapore<br> 53 Cantonment Road #02-00<br> </td> <td> Malaysia<br> Suite 2A-5-1, Block 2A, Plaza Sentral<br> </td> </tr> <tr> <td> 12, place de La Défense<br> Maison de La Défense<br> </td> <td> Room 315, Kim Nam Venture Building<br> Binjiang District<br> </td> </tr> </table> </body></html>
谢谢楼上两位,用table-cell 也可以写出来了。
CSS 部分:
。。。。。。。
.table{
display:table;
width:1300px;
margin:0 auto;
text-align:center;
}
.office-location{
display:table-cell;
*display:inline-block;
width:1000px;
*width:auto;
}
。。。。。
6c04bd5ca3fcae76e30b72ad730ca86d部分
56368239dbc9200bb7b33119577a55cc
c4e95686469f2eb8c8fcb2e3be99b396
5d2ac2df90db22d2010cbf21192a92bc
4e8ddd9d065e2b51a894fd9633315354
7491ae7c89ec42f2ac0bb04f136a5bc1
16b28748ea4df4d9c2150843fecfba68
c95c06815487f6e2ca8ea02a9110cd7b
43bd9f48938db2c57dfdd8f2d64f33fc
e388a4556c0f65e1904146cc1a846beestreet 194b3e26ee717c64999d7867364b1b4a3
e388a4556c0f65e1904146cc1a846beeSingapore 08175394b3e26ee717c64999d7867364b1b4a3
16b28748ea4df4d9c2150843fecfba68
16b28748ea4df4d9c2150843fecfba68
d872c65f576ccc9e7183d6c5b1d3ae4a
2af3439fdb9386fee3114cc3b9d73725singapore@icognitive.com5db79b134e9f6b82c0b36e0489ee08ed
16b28748ea4df4d9c2150843fecfba68
16b28748ea4df4d9c2150843fecfba68
16b28748ea4df4d9c2150843fecfba68
ce424495be7d811dc5e3f44dffda27e8
9be0d03acf41ebc92dfabe57fd2fbb84
...
16b28748ea4df4d9c2150843fecfba68
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e