table 能设圆角 css,table&css圆角边框效果

table 能设圆角 css,table&css圆角边框效果挺好用的放在最下面比较好看所以就一个下圆角的实例上圆角按照代码很容易做 图传不上来 head 区 body font 100 01 TrebuchetMS Verdana Arial sans serif h1 h2 p margin 010px h1 font size 250 color FFF h2 font size 200 color f0f0f0 p

挺好用的 放在最下面比较好看 所以就一个下圆角的实例 上圆角按照代码很容易做。。。

图传不上来

head区

body{ font:

100.01% “Trebuchet MS”,Verdana,Arial,sans-serif}

h1,h2,p{margin: 0 10px}

h1{font-size: 250%;color: #FFF}

h2{font-size: 200%;color: #f0f0f0}

p{padding-bottom:1em}

h2{padding-top: 0.3em}

div#nifty{ margin: 0 10%;background: #FFF}

b.rtop, b.rbottom{display:block;background: #FFF}

b.rtop b, b.rbottom b{display:block;height: 1px;

overflow:

hidden; background: #61aec8}

b.r1{margin: 0 5px}

b.r2{margin: 0 3px}

b.r3{margin: 0 2px}

b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px}

.STYLE2 {color: #3399CC}

body区

class=”rbottom”>

class=”r4″>

class=”r3″>

class=”r2″>

class=”r1″>

前面是css样式咯 后面r几对应上面的设置 简单~

a4c26d1e5885305701be709a3d33442f.png

table页 从别人那里粘贴过来的 我的中间东西太多了= =|||

td

{

font-size:

12px;

color:

#000000;

line-height:

150%;

}

.sec1 {

background-color: #EEEEEE;

cursor: hand;

color: #000000;

border-left: 1px solid #FFFFFF;

border-top: 1px solid #FFFFFF;

border-right: 1px solid gray;

border-bottom: 1px solid #FFFFFF

}

.sec2

{

background-color: #D4D0C8;

cursor: hand;

color: #000000;

border-left: 1px solid #FFFFFF;

border-top: 1px solid #FFFFFF;

border-right: 1px solid gray;

font-weight: bold;

}

.main_tab

{

background-color: #D4D0C8;

color:

#000000;

border-left:1px solid #FFFFFF;

border-right: 1px solid gray;

border-bottom: 1px solid gray;

}

function secBoard(n)

{

for(i=0;i

secTable.cells[i].className=”sec1″;

secTable.cells[n].className=”sec2″;

for(i=0;i

mainTable.tBodies[i].style.display=”none”;

mainTable.tBodies[n].style.display=”block”;

}

cellspacing=0 cellpadding=0 width=549 id=secTable

onMouseOut=”secBoard(0)”>

//

应把onMoseOut删除掉 不删掉效果是鼠标离开选项卡

自动页secBoard(0)

onMouseLeave的意思是鼠标离开这个表格自动弹回某页 无必要可不加

align=center>

onMouseOver=”secBoard(0)”>menu_1

// 由于是默认选择的 所以这里选择了css sec2的样式

onMouseOver=”secBoard(1)”>menu_2

onMouseOver=”secBoard(2)”>menu_3

onMouseOver=”secBoard(3)”>menu_4

width=549 height=240

id=mainTable

class=main_tab >

style=”display:block;”>

第1列内容

style=”display:none;” >

第二列内容

style=”display:none;”>

第三列内容

style=”display:none;”>

第四列内容

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/219727.html原文链接:https://javaforall.net

(0)
上一篇 2026年3月17日 下午10:01
下一篇 2026年3月17日 下午10:02


相关推荐

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号