〖Html代码〗单元文本框制作

 

<!---->

 

代码:
<div STYLE="
border-style :solid; border-width :5pt; border-color :red">日志文字</div>

说明:

   1、它会在你的文字外围生成一个红色边框,效果如框内显示。

         2、border-style:控制边框的效果

         3、border-width:控制边框的粗细,

         4、border-color:调整边框的颜色,可用形式如#xxxxxx的颜色数值

         5、这里可使用如#xxxxxx的颜色数值,当使用“solid”则为单一颜色的线形简单边框。

         6、Solid 简单线形边框   Double 简单双线边框   Groove 沟线立体效果边框 
              Ridge 脊线立体效果边框   Inset 嵌入线立体效果边框  Outset 浮出线立体效果边框
       dotted 简单的圆点边框 dashed 简单的虚线边框

         7、Border-left-style:solid (double, groove, ridge, inset, outset,dotted,dashed)定制边框样式
              Border-left-color: #xxxxxx定制边框颜色
              Border-left-width: xpt 定制边框粗细
              其他三个边框只要分别使用Right, Top, Bottom就可以了

代码:
<div STYLE="border-style:double;border-width:5pt; border-color:red">日志文字</div>

 

代码:
<div STYLE="border-style:groove;border-width:5pt; border-color:red">日志文字</div>

 

代码:
<div STYLE="border-style:ridge;border-width:5pt; border-color:red">日志文字</div>

 

代码:
<div STYLE="border-style:inset;border-width:5pt; border-color:red">日志文字</div>

 

代码:
<div STYLE="border-style:outset;border-width:5pt; border-color:red">日志文字</div>

 

代码:
<div STYLE="border-style:dotted;border-width:5pt; border-color:red">日志文字</div>

 

代码:
<DIV style="BORDER-RIGHT: #ff69b4 10pt groove; BORDER-TOP: #ff69b4 10pt groove; BORDER-LEFT: #ff69b4 10pt groove; BORDER-BOTTOM: #ff69b4 10pt groove">
<P>文字</P></DIV>

 

代码:
<div style= "border-top-style:Ridge;border-right-style:Ridge;border-left-style:Ridge;
border-bottom-style:Ridge;border-width:7pt; background-color:#8B008B"><div style="width:100%;height:100%;background-color:#E6E6FA;">文字</div></div>

 

代码:

<DIV style="WIDTH: 484px; HEIGHT: 188px">
<DIV style="FILTER: Dropshadow(color=#cccccc,offX=10,offY=10); WIDTH: 95.43%; FONT-FAMILY: Verdana; HEIGHT: 28.57%" align=center>
<DIV style="BORDER-RIGHT: #ffffdd 3px dotted; BORDER-TOP: #ffffdd 3px dotted; FONT-SIZE: 9pt; BORDER-LEFT: #ffffdd 3px dotted; WIDTH: 317px; LINE-HEIGHT: 11pt; BORDER-BOTTOM: #ffffdd 3px dotted; FONT-FAMILY: Verdana; HEIGHT: 110px; BACKGROUND-COLOR: #ffffcc" align=left><FONT face=新細明體 color=#333333>
<P align=center><FONT color=#cc99ff></FONT>&nbsp;</P>
<P align=center><FONT color=#cc66ff>日志文字</FONT></P>
<P align=center><FONT color=#cc66ff>&nbsp;</FONT></P>
<P align=left><FONT color=#cc66ff></FONT>&nbsp;</P></FONT></DIV></DIV></DIV>

 

文本框代码:
<DIV style="BORDER-RIGHT: #cc6600 5px dotted; PADDING-RIGHT: 10px; BORDER-TOP: #cc6600 5px dotted; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; BORDER-LEFT: #cc6600 5px dotted; PADDING-TOP: 10px; BORDER-BOTTOM: #cc6600 5px dotted; BACKGROUND-COLOR: #ffffff">文字</DIV>

 

文本框代码:
<div STYLE="border-style:dotted;border-width:6pt; border-color: #808080">
<div style="width:100%;height:100%;background-color:#7B6699;">文字</div></div>

 

文本框代码:
<div STYLE="border-style:dotted;border-width:4pt; border-color: #448CBB">
<div style="width:100%;height:100%;background-color:#A0AEE7;">文字</div></div>
 
文本框代码:
<div STYLE="border-style:dashed;border-width:4pt; border-color: #448CBB">
<div style="width:100%;height:100%;background-color:#A0AEE7;">文字</div></div>

 

 

   原文:http://blog.readnovel.com/article/htm/tid_361647.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值