HTML中设置边框方法:
方法/步骤
1、一个普通的表格如下:
相关设置
2、单元格边距(表格填充)(cellpadding) -- 代表单元格外面距离,用于隔开单元格与单元格之间的空间 单元格间距(表格间距)(cellspacing) -- 代表表格边框与单元格补白的距离。
具体代码如下:
<table border='1'cellspacing="0" cellpadding="0" > <tr> <td width="200">1</td> <td width="200">2</td> <td width="200">3</td> </tr> <tr> <td>a</td> <td>b</td> <td>c</td> </tr> <tr> <td>中国</td> <td>我</td> <td>爱你</td> </tr> </table>
效果如图
文字不居中?
3、设置一下就好了。
代码如下:
<style type="text/css">.onecenter{text-align:center;width:200px;}</style><table border='1'cellspacing="0" cellpadding="0" > <tr> <td class='onecenter'>1</td> <td class='onecenter'>2</td> <td class='onecenter'>3</td> </tr> <tr> <td class='onecenter'>a</td> <td class='onecenter'> b</td> <td class='onecenter' > c</td> </tr > <tr> <td class='onecenter' >中国</td> <td class='onecenter' >我</td> <td class='onecenter' >爱你</td> </tr> </table>
4、为了方便一点我直接把样式写在上面了。
效果如图:
5、每一个表格都是一个完整的方框,如果想要线条更细。
6、看如下代码:
<style type="text/css">.onecentertext-align:center;width:200px;height:50px;}#sebackground-color:#006699 ;padding:20px;color:#FFF;}</style><table border='1'cellspacing="0" cellpadding="20" > <tr> <td class='onecenter'>1</td> <td class='onecenter' style='border-left:0px;border-right:0px;' >2</td> <td class='onecenter'>3</td> </tr> <tr> <td class='onecenter'>a</td> <td class='onecenter' style='border:0px'> b</td> <td class='onecenter' > c</td> </tr > <tr id='se'> <td class='onecenter' >中国</td> <td class='onecenter' >我</td> <td class='onecenter' >爱你</td> </tr> </table>
7、这段代码主要是针对某些表格做了些设置,让某些表格不显示出来。
在html当中,为标签设置底部边框,采用border-bottom的CSS属性即可,具体代码如下:
<style>
2.con {
3. border-bottom: 5px solid #000;4. }5.</style>6.<div class="con">标签底部有5像素黑色边框</div>
超文本标记语言,标准通用标记语言下的一个应用。
“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。
超文本标记语言的结构包括“头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息,“主体”部分提供网页的具体内容。
2011-11-09
border:1px solid #F00
三个属性顺序可以乱 中间一个半角空格隔开
1PX表示边框宽度
solid表示边框为实线
#F00后面是指边框的样式
你可以换成其它样式
border=“1" // 定义边框宽度
border-color="" //定义边框颜色
border-style=" " //定义边框样式