Profil。-‿◕。☞ShIrLy雪々素材小天堂☜。◕‿-FotosBlogListen Extras Hilfe

Blog


    26 September

    文本框代码整理

    文本框代码整理

    立体线框代码

     

    女巫根据浮云城主的立体线框代码稍加润色后的效果:

    <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="BORDER-RIGHT: 5pt ridge; BORDER-TOP: 5pt ridge; BORDER-LEFT: 5pt ridge; BORDER-BOTTOM: 5pt ridge; BACKGROUND-COLOR: #a0522d">
    <DIV style="WIDTH: 100%; HEIGHT: 100%; BACKGROUND-COLOR: #ffc0cb">文字</DIV></DIV>

    背景为粉红色,效果如框内所示。

     

     

    女巫配色:

    <DIV style="BORDER-RIGHT: 5pt ridge; BORDER-TOP: 5pt ridge; BORDER-LEFT: 5pt ridge; BORDER-BOTTOM: 5pt ridge; BACKGROUND-COLOR: #a0522d">
    <DIV style="WIDTH: 100%; HEIGHT: 100%; BACKGROUND-COLOR: #ffdab9">文字</DIV></DIV>

    背景为桃色,效果如框内所示。

     

     

    根据Loadmemory的教程修改后配色为己用的立体彩色边框代码,效果如下

          立体效果的彩色边框是在border-style后面使用不同的语法描述:

          Solid 简单线形边框 Double 简单双线边框 Groove 沟线立体效果边框 Ridge 脊线立体效果边框 Inset 嵌入线立体效果边框 Outset 浮出线立体效果边框。
     

          通过定制边框的方法再将上一教程添加色彩的语法嵌套其中,你就可以创造出具有立体效果的彩色日志背景。如:

    <div STYLE="border-style:outset;border-width:2pt; border-color: red">
    <div style="width:100%;height:100%;background-color:#ffdead;">日志文字
    </div></div>

         使用上述语法将会为你呈现一个NAVAJO白底色红边框的浮出线效果背景,效果如框内显示。

     

     

    女巫配色:

    <div STYLE="border-style:outset;border-width:3pt; border-color: red">
    <div style="width:100%;height:100%;background-color:#ffdab9;">日志文字
    </div></div>

          显示的效果是背景色为桃色的立体线框。效果如框内所示,框内背景色为桃色#ffdab9。

     

    立体框代码:   

    <P><FONT color=#ffb6c1><FONT color=#cc0033 size=2>&nbsp;</P>
    <DIV style="BORDER-RIGHT: #ff69b4 10pt groove; BORDER-TOP: #ff69b4 10pt groove; BORDER-LEFT: #ff69b4 10pt groove; BORDER-BOTTOM: #ff69b4 10pt groove">
    <P><FONT color=#cc0033 size=2>&nbsp;&nbsp;&nbsp; 日志文字</FONT></FONT></FONT></P></DIV>
    <P>&nbsp;</P>

     

    代码如下:

    <P>&nbsp;</P>
    <DIV align=center>
    <DIV id=layer1 style="BORDER-RIGHT: #e68e66 3px ridge; BORDER-TOP: #e68e66 3px ridge; Z-INDEX: 1; LEFT: 22px; BORDER-LEFT: #e68e66 3px ridge; WIDTH: 363px; BORDER-BOTTOM: #e68e66 3px ridge; TOP: 60px; HEIGHT: 400px; BACKGROUND-COLOR: #feede2" align=center><FONT face=Verdana color=#e68e66>
    <P align=center><BR><FONT size=7>日志文字</FONT></FONT></P></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-style:Double;border-width:8pt; border-color: #8B008B">
    <div style="width:100%;height:100%;background-color:#E6E6FA;">文字</div></div>

    效果如框内,是带背景色(熏衣草色)的简单双线框。

    女巫根据浮云城主的双线框代码配色后的效果:

    <div STYLE="border-style:Double;border-width:6pt; border-color: #ff4500">
    <div style="width:100%;height:100%;background-color:#ffdab9;">文字</div></div>

         显示的效果是背景色为桃色的简单双线框。效果如框内所示,边框的颜色是橙红色#ff4500,框内背景色为桃色#ffdab9。

    女巫配色:

    <div STYLE="border-style:Double;border-width:6pt; border-color: #ff4500">
    <div style="width:100%;height:100%;background-color:#FFdead;">文字</div></div>

          显示的效果是背景色为NAVAJO白的简单双线框。效果如框内所示,边框的颜色是橙红色#ff4500,框内背景色为桃色#ffdead。

     

    女巫配色:

    <div STYLE="border-style:Double;border-width:6pt; border-color: #ff4500">
    <div style="width:100%;height:100%;background-color:#FFFFE0;">文字</div></div>

          背景颜色为淡黄色#FFFFE0,效果如框内所示。

     

    女巫配色:

    <div STYLE="border-style:Double;border-width:6pt; border-color: #f08080">
    <div style="width:100%;height:100%;background-color:#FFdead;">文字</div></div>

          这种双线框的效果有若隐若现的感觉,框的颜色是淡珊瑚色#f08080,框内背景的颜色是NAVAJO白#FFdead。效果如框内所示。

     

    女巫配色:

    <div STYLE="border-style:Double;border-width:6pt; border-color: #f08080">
    <div style="width:100%;height:100%;background-color:#FFFFE0;">文字</div></div>

          这种双线框的效果有若隐若现的感觉,框的颜色是淡珊瑚色#f08080,框内背景的颜色是淡黄色#FFFFE0。效果如框内所示。

     

     

     您是第集会在网上选拔位朋友光临烟视媚行!
         (从Mar 4th, 2005起)


    双线框+背景色代码如下:

    代码如下:

    <DIV style="BORDER-RIGHT: blue 8pt double; BORDER-TOP: blue 8pt double; BORDER-LEFT: blue

    8pt double; BORDER-BOTTOM: blue 8pt double" align=center>
    <DIV style="WIDTH: 100%; HEIGHT: 72.65%; BACKGROUND-COLOR: #ccffff" align=left>
    <DIV style="BORDER-RIGHT: #000099 1px dashed; BORDER-TOP: #000099 1px dashed; BORDER-LEFT:

    #000099 1px dashed; BORDER-BOTTOM: #000099 1px dashed; BACKGROUND-COLOR: #ddffaa"

    align=left><FONT face="Verdana, Geneva, Arial, Sans-serif"><STRONG>&nbsp;<IMG height=19

    src="http://spaces.msn.com/mmm2005-01-24_16.34/RTE/emoticons/star.gif"

    width=19></STRONG><FONT color=#0000ff>您是第<A

    href="http://www.worldlingo.com/wl/translate?wl_lp=EN-zh_cn&amp;wl_glossary=gl1&amp;wl_fl=2&

    amp;wl_ucp=1&amp;wl_rurl=http://www.amazingcounters.com/sign-up3.php&amp;wl_url=www.trudatin

    g.com" target=_top><IMG height=32 alt=集会在网上选拔

    src="http://www.amazingcounters.com/counter.php?i=90331&amp;c=271306" width=180 align=center

    border=0></A>位朋友光临烟视媚行! <IMG height=19

    src="http://spaces.msn.com/mmm2005-01-24_16.34/RTE/emoticons/smile_regular.gif"

    width=19><IMG height=19

    src="http://spaces.msn.com/mmm2005-01-24_16.34/RTE/emoticons/star.gif" width=19><A title=只

    看不回应是会给別人鄙視的哦!~^_^

    href="http://spaces.msn.com/members/sunniness2/Blog/cns!1pWtz3warMV6Pn1aUxjtxGUQ!106.entry"

    target=_blank><IMG height=15

    src="http://storage.msn.com/x1pI_sTnOAQGnzNFqUAChFZN7IXfNJRGU_WBvLJGpJzG3U6mucqyCcrSzAmyejmd

    8eQDcMzMU1aqDgSgXZKXxdwZobkbTkQpVd7qwTbAI5tX8R8JQ1CRPNzYQ" width=80 align=right

    border=0></A><A

    href="http://spaces.msn.com/members/samzhu/Blog/cns!1p4gQIwuW21wl3nlPWUqyjmw!106.entry"><STR

    ONG></STRONG></A><BR>&nbsp;&nbsp;&nbsp;&nbsp; (从Mar 4th, 2005起

    )<STRONG></STRONG></FONT></FONT><FONT face="Verdana, Geneva, Arial, Sans-serif"><FONT

    color=#0000ff><BR></DIV>
    <P align=center><BR>日志文字</P>
    <P align=center>&nbsp;</P></FONT></FONT></DIV></DIV>

    ——取自八度空间女巫润色

     

     以上资料由  女巫制造  提供 

    Kommentare (2)

    Bitte warten...
    Der eingegebene Kommentar ist zu lang. Bitte kürzen Sie ihn.
    Sie haben keine Angabe gemacht. Bitte versuchen Sie es erneut.
    Ihr Kommentar kann im Moment leider nicht hinzugefügt werden. Bitte versuchen Sie es später erneut.
    Zum Hinzufügen eines Kommentars ist die Erlaubnis von einem Elternteil erforderlich. Erlaubnis einholen
    Der Elternteil hat die Kommentarfunktion deaktiviert.
    Ihr Kommentar kann im Moment leider nicht gelöscht werden. Bitte versuchen Sie es später erneut.
    Sie haben die maximale Anzahl an Kommentaren, die pro Tag zugelassen sind, überschritten. Versuchen Sie es in 24 Stunden erneut.
    Kommentare wurden in Ihrem Konto deaktiviert, da in unseren Systemen angegeben wird, dass Sie anderen Benutzern möglicherweise unerwünschte E-Mails versenden. Wenn Sie der Meinung sind, dass es sich beim Deaktivieren Ihres Kontos um einen Fehler handelt, wenden Sie sich an Windows Live Support.
    Schließen Sie die Sicherheitsüberprüfung unten ab, damit Sie ein Kommentar hinterlassen können.
    Die bei der Sicherheitsüberprüfung eingegebenen Zeichen müssen den Zeichen im Bild oder in der Audiodatei entsprechen.

    Melden Sie sich zum Hinzufügen eines Kommentars mit Ihrer Windows Live ID an (wenn Sie Hotmail, Messenger oder Xbox LIVE verwenden, besitzen Sie eine Windows Live ID). Anmelden


    Sie haben noch keine Windows Live ID? Registrieren

    vivischrieb:
    我很喜欢这些。我链接了这个地址在空间里。谢谢。
    5 Apr.
    Bild von Anonym
    〓P●E●G●G●Y〓 schrieb:
    可爱的Shirely,这些是怎么用的啊,再写一点[使用说明]嘛,像我这么苯苯的人毕竟多嘛!
    14 Feb.

    Trackbacks

    Die Trackback-URL für diesen Eintrag ist:
    http://shirlyli2000.spaces.live.com/blog/cns!A2D2A5401BEC634B!295.trak
    Weblogs, die sich auf diesen Eintrag beziehen
    • Keine