网页制作中,上下两个表格的间距怎么调? 网页设计中表格与表格之间的间距,怎么整?

\u7f51\u9875\u5236\u4f5c\u4e2d\uff0c\u4e0a\u4e0b\u4e24\u4e2a\u8868\u683c\u7684\u95f4\u8ddd\u600e\u4e48\u8c03\uff1f

\u3000\u3000\u901a\u5e38\u6709\u4ee5\u4e0b\u51e0\u79cd\u65b9\u6cd5\uff1a
1\u3001CSS\u6cd5
\u53ef\u4ee5\u5728\u6807\u7b7e\u4e2d\u8bbe\u7f6emargin\u5c5e\u6027\uff0c\u5373\uff1astyle="margin:5px
0
5px
0;"\uff08\u987a\u5e8f\uff1a\u4e0a\u3001\u53f3\u3001\u4e0b\u5de6\uff0c\u4ea6\u53ef\u7b80\u5199\u4e3astyle="margin:
5px
0;"\uff09\uff0c\u8fd9\u6bb5CSS\u7684\u4f5c\u7528\u662f\u5728\u5f53\u524d\u8868\u683c\u5916\u90e8\u7684\u4e0a\u4e0b\u5404\u7559\u51fa5px\u7684\u7a7a\u767d\u3002
2\u3001\u7a7a\u5bf9\u8c61\u6cd5
\uff081\uff09\u7a7a\u884c\u3002\u8fd8\u53ef\u4ee5\u5728\u8868\u683c\u540e\u6572\u56de\u8f66\u6362\u884c\uff0c\u4ea7\u751f\u6807\u7b7e\uff0c\u6216\u8005\u6309Shift+\u56de\u8f66\u8f6f\u6362\u884c\uff0c\u4ea7\u751f\u6807\u7b7e\uff0c\u90fd\u53ef\u4ea7\u751f\u4e00\u4e2a\u7a7a\u884c\u3002
\uff082\uff09\u7a7a\u8868\u683c\u3002\u63d2\u5165\u4e00\u4e2a1\u884c1\u5217\u7684\u8868\u683c\uff0c\u8bbe\u7f6e\u5355\u5143\u683c\u7684\u5bbd\u5ea6\u3001\u9ad8\u5ea6\uff0c\u5728\u5355\u5143\u683c\u4e2d\u4e0d\u8f93\u5165\u5185\u5bb9\u3002\u5f53\u5355\u5143\u683c\u9ad8\u5ea6\u5c0f\u4e8e12px\u65f6\uff0c\u4e00\u5b9a\u8981\u5c06\u7a7a\u683c\u7b26
\u5220\u6389\uff0c\u5426\u5219\u8fbe\u4e0d\u5230\u8bbe\u5b9a\u9ad8\u5ea6\uff0c\u8fd9\u4e00\u70b9\u975e\u5e38\u91cd\u8981\u3002\u5373\uff1a
<table
width="100%"
border="0"
cellspacing="0"
cellpadding="0">

<td
height="5">


\uff083\uff09\u7a7aDIV\u3002\u7c7b\u4f3c\u4e8e\u7a7a\u8868\u683c\uff0c\u63d2\u5165\u4e00\u4e2aDIV\uff0c\u8bbe\u7f6e\u5176\u5bbd\u5ea6\u3001\u9ad8\u5ea6\uff0c\u8d85\u51fa\u9690\u85cf\u5373\u53ef\u3002
<div
style="width:100px;height:5px;overflow:hidden;clear:both;"
3\u3001\u900f\u660e\u56fe\u7247\u6cd5
\u53ef\u4ee5\u5728PS\u4e2d\u65b0\u5efa\u4e00\u4e2a5x5px\u7684\u753b\u5e03\uff0c\u80cc\u666f\u8bbe\u4e3a\u900f\u660e\uff0c\u4fdd\u5b58\u4e3a\u900f\u660eGIF\u56fe\u7247\uff0c\u7136\u540e\u5728\u9700\u8981\u7559\u95f4\u8ddd\u7684\u8868\u683c\u540e\u9762\u63d2\u5165\u8fd9\u4e2a\u900f\u660e\u56fe\u7247\uff0c\u5c06\u5176\u5bbd\u5ea6\u3001\u9ad8\u5ea6\u53ef\u4ee5\u4efb\u610f\u8c03\u6574\uff0c\u76f4\u5230\u6ee1\u610f\u4e3a\u76f4\u3002
<img
src="null.gif">

\u4f60\u5c06\u8fd9\u4e24\u5f20\u8868\u683c\u653e\u5728\u4e00\u5f20\u5927\u8868\u683c\u4e2d\u8bd5\u8bd5\u3002\u8fd9\u5f20\u5927\u8868\u683c\u8bbe\u7f6e\u4e3a\u4e24\u884c\u4e00\u5217\uff0c\u5728\u7b2c\u4e00\u884c\u4e2d\u63d2\u5165\u4e00\u884c\u4e94\u5217\u7684\u8868\u683c\u505a\u4f60\u4e0a\u9762\u7684\u5bfc\u822a\uff0c\u5728\u7b2c\u4e8c\u884c\u63d2\u5165\u4f60\u4e0b\u9762\u505a\u7684\u8868\u683c\uff0c\u4e0d\u77e5\u53ef\u884c\uff0c\u8bd5\u8bd5\u770b\u3002

  通常有以下几种方法:
1、CSS法
可以在<table>标签中设置margin属性,即:style="margin:5px 0 5px 0;"(顺序:上、右、下左,亦可简写为style="margin: 5px 0;"),这段CSS的作用是在当前表格外部的上下各留出5px的空白。
2、空对象法
(1)空行。还可以在表格后敲回车换行,产生<p></p>标签,或者按Shift+回车软换行,产生<br>标签,都可产生一个空行。
(2)空表格。插入一个1行1列的表格,设置单元格的宽度、高度,在单元格中不输入内容。当单元格高度小于12px时,一定要将空格符 删掉,否则达不到设定高度,这一点非常重要。即:
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="5"></td>
</tr>
</table>
(3)空DIV。类似于空表格,插入一个DIV,设置其宽度、高度,超出隐藏即可。
<div style="width:100px;height:5px;overflow:hidden;clear:both;"
3、透明图片法
可以在PS中新建一个5x5px的画布,背景设为透明,保存为透明GIF图片,然后在需要留间距的表格后面插入这个透明图片,将其宽度、高度可以任意调整,直到满意为直。
<img src="null.gif">

<table width="200" border="1" cellspacing="2">
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>

cellspacing就是控制间距的

表格之间写几个<br>
要学css的话先去看本有关的书

<table cellpadding="表格间距">

css 我就不知道了

用回车就可以呀

  • 缃戦〉鍒朵綔涓,涓婁笅涓や釜琛ㄦ牸鐨勯棿璺鎬庝箞璋?
    绛旓細1銆丆SS娉 鍙互鍦ㄦ爣绛句腑璁剧疆margin灞炴э紝鍗筹細style="margin:5px 0 5px 0;"锛堥『搴忥細涓娿佸彸銆佷笅宸︼紝浜﹀彲绠鍐欎负style="margin: 5px 0;"锛夛紝杩欐CSS鐨勪綔鐢ㄦ槸鍦ㄥ綋鍓琛ㄦ牸澶栭儴鐨涓婁笅鍚勭暀鍑5px鐨勭┖鐧姐2銆佺┖瀵硅薄娉 锛1锛夌┖琛屻傝繕鍙互鍦ㄨ〃鏍煎悗鏁插洖杞︽崲琛岋紝浜х敓鏍囩锛屾垨鑰呮寜Shift+鍥炶溅杞崲琛岋紝浜х敓鏍囩...
  • 涓婁笅涓や釜琛ㄦ牸涔嬮棿璺濈鎬庝箞璋冩暣?
    绛旓細- 鍙︿竴绉嶆柟娉曟槸鍦ㄤ袱涓〃鏍间箣闂寸洿鎺ユ彃鍏ヤ竴涓垨澶氫釜绌虹櫧琛屻傝繖灏嗛氳繃澧炲姞绌虹櫧琛岀殑鏁伴噺鏉ヨ皟鏁磋〃鏍间箣闂寸殑璺濈銆- 鍦ㄦ偍鎯宠鎻掑叆绌虹櫧琛岀殑浣嶇疆锛屽皢鍏夋爣鏀剧疆鍦ㄤ袱涓〃鏍间箣闂寸殑浣嶇疆銆- 鐒跺悗锛屾寜涓嬧淓nter鈥濋敭澶氭锛屼互鎻掑叆鎵闇鏁伴噺鐨勭┖鐧借銆3. 璋冩暣琛ㄦ牸杈硅窛锛- 濡傛灉鎮ㄥ湪Excel涓娇鐢ㄨ〃鏍硷紝鎮ㄥ彲浠ヨ皟鏁磋〃鏍肩殑杈硅窛...
  • html涓涓や釜琛ㄦ牸闂鐨勮窛绂濡備綍璋冩暣?
    绛旓細1.璁剧疆绗竴涓猼bale鐨刴argin-bottom灞炴с備緥濡傦細琛ㄧずtable琛ㄦ牸搴曢儴淇濇寔100px闂磋窛銆2.璁剧疆绗浜屼釜tbale鐨刴argin-top灞炴с備緥濡傦細琛ㄧずtable琛ㄦ牸椤堕儴淇濇寔100px闂磋窛銆傛墿灞曠煡璇 margin 灞炴у彲浠ュ崟鐙敼鍙樺厓绱狅紙鍏冪礌鍙互鏄〃鏍兼垨鑰匘IV锛夌殑涓婏紝涓嬶紝宸︼紝鍙宠竟璺濄備篃鍙互涓娆℃敼鍙樻墍鏈夌殑灞炴с俶argin 灞炴у崟鐙娇鐢ㄦ椂锛氫緥1...
  • 缃戦〉涓殑form涓轰粈涔堜細浣涓婁笅涓や釜琛ㄦ牸闂磋窛鍔犲ぇ
    绛旓細鏄洜涓烘妸form鏀惧埌<form<table</table
  • 缃戦〉鍒朵綔涓鎬庝箞鎺у埗涓や釜琛ㄦ牸涔嬮棿鐨勯棿璺
    绛旓細琛ㄦ牸涔嬮棿鐨勯棿璺瑙e喅鏂规硶:鍦ㄧ涓涓〃鏍閲岄潰鍔涓婁笅闈㈢殑浠g爜
  • 涓涓猈ORD椤甸潰涓涓や釜涓鏍风殑琛ㄦ牸鎬庝箞鍙互璁╁畠浠涓婁笅瀵归綈
    绛旓細1銆侀鍏堝湪鎵撳紑鐨刉ord椤甸潰涓彲浠ョ湅鍒涓婁笅涓や釜琛屾暟鍜屽垪鏁扮浉鍚岀殑琛ㄦ牸涓婁笅涓嶅榻愩2銆侀変腑涓婇潰鐨勮〃鏍煎悗鍦ㄥ伐鍏锋爮涓殑鈥滆〃鏍煎伐鍏封濅笅閫夋嫨鈥滃竷灞鈥濋夐」銆3銆佺劧鍚庡湪鈥滃崟鍏冩牸澶у皬鈥濆鍙互鐪嬪埌閫変腑鐨琛ㄦ牸鐨楂樺害鍜屽搴︾殑鏁板硷紝璁颁綇璇ョ粍鏁版嵁銆4銆佺劧鍚庡啀鐐瑰嚮绗浜屼釜琛ㄦ牸锛灏嗗叾鍗曞厓鏍煎ぇ灏忕殑瀹藉害鍜岄珮搴﹁缃褰曚笅鏉ョ殑绗...
  • word涓涓や釜琛ㄦ牸闂鐨勮窛绂鎬庝箞鏍疯皟鏁磜ord涓や釜琛ㄦ牸瀹藉害鎬庝箞瀵归綈
    绛旓細鍦 Word 涓紝鍙互閫氳繃浠ヤ笅鏂规硶璋冩暣涓や釜琛ㄦ牸涔嬮棿鐨勮窛绂伙細1. 浣跨敤娈佃惤闂磋窛锛氬湪涓や釜琛ㄦ牸涔嬮棿鎻掑叆涓涓┖娈佃惤锛屽苟鍦ㄦ钀藉睘鎬т腑璋冩暣娈佃惤闂磋窛澶у皬銆2. 璋冩暣琛ㄦ牸杈硅窛锛氬湪琛ㄦ牸灞炴т腑璋冩暣琛ㄦ牸鐨勪笂涓嬭竟璺濆ぇ灏忥紝杩欐牱灏卞彲浠ュ湪琛ㄦ牸涔嬮棿澧炲姞涓瀹氱殑璺濈銆3. 浣跨敤鍒嗛殧绾匡細鍦ㄤ袱涓〃鏍间箣闂存彃鍏ヤ竴鏉$粏绾夸綔涓哄垎闅旂嚎銆傚彲浠ラ氳繃鍦...
  • 鏈塪reamweaver鍋缃戦〉鐨鏃跺,鎬庝箞鎶涓や釜琛ㄦ牸涔嬮棿鐨勯棿璺娑堝幓?
    绛旓細鏈変袱绉嶆儏鍐碉細1.FLASH鏈韩鐨勯棶棰橈紝涔熻鏄疐LASH鐨勪腑闂存墠鏈夊厓绱狅紝涓よ竟绌虹櫧澶锛屾墍浠ユ祻瑙堣捣鏉ュ儚鏄媺寮浜嗛棿璺濓紒2.琛ㄦ牸鐨璁剧疆鏈夐棶棰橈紝濡傛灉琛ㄦ牸闂磋窛涓0锛屽乏杈圭殑鍗曞厓鏍肩疆涓哄彸瀵归綈锛屽彸杈圭殑鍗曞厓鏍艰涓哄乏瀵归綈鐨勮瘽锛屼袱涓FLASH鑲畾鏄病闂磋窛鐨勶紒
  • 缃戦〉鍒朵綔濡備綍璁剧疆琛ㄦ牸鐨勯棿璺鍜岃儗鏅
    绛旓細鍥炵瓟锛氭楠や竴:鍦ㄦ墦寮鐨缃戦〉鏂囨。涓夋嫨琛ㄦ牸鍚,鍦ㄢ濆睘鎬р滈潰鏉夸腑鍗冲彲瀵琛ㄦ牸鐨灞炴ц繘琛岃缃傞鍏堣缃〃鏍肩殑id鍜岃鍒楀笺 姝ラ浜:鎺ヤ笅鏉ヨ缃〃鏍肩殑瀹藉害鍜岄珮搴︺傗濆鈥滃拰鈥濋珮鈥濅互鍍忕礌涓哄崟浣,鎴栨寜鍗犳祻瑙堝櫒绐楀彛鐨勫搴﹀拰楂樺害鐨勭櫨鍒嗘瘮鏉ヨ绠楄〃鏍肩殑瀹藉害鍜岄珮搴︺傗滃鈥濅笌鈥滆〃鏍尖濆璇濇涓殑鈥滆〃鏍煎搴︹濋夐」...
  • 鍦ㄥ悓涓涓狤XCEL鏂囨。涓,濡傝涓婁笅缂栬緫涓や釜琛ㄦ牸,浣嗘牸寮闂磋窛涓嶄竴鏍,搴旀庝箞...
    绛旓細鍒嗗埆閫変腑涓や釜琛ㄦ牸锛岃繘琛屾牸寮忚缃拰琛岄珮璁剧疆銆傛敞鎰忥細涓婁笅涓や釜琛ㄦ牸锛鍒楀涓嶅彲鑳戒笉鍚岀殑銆
  • 扩展阅读:网页制作五个步骤 ... 一键生成数据分析图 ... 学生个人网页制作html ... 表格制作在线编辑 ... 免费学生网页制作成品 ... 免费个人网页制作成品 ... 网页制作模板大全 ... 在网页里做一个表格 ... 网页制作表单下拉菜单 ...

    本站交流只代表网友个人观点,与本站立场无关
    欢迎反馈与建议,请联系电邮
    2024© 车视网