Hugege’s themes demo

个性样式:

朴素大方的样式:

         

#m_search input.submit{
BORDER-RIGHT: #3377e3 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #3377e3 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px;

BACKGROUND: #ade75b; PADDING-BOTTOM: 0px; MARGIN-LEFT: 4px; OVERFLOW: hidden; BORDER-LEFT: #3377e3 1px solid; WIDTH: 100px; COLOR: #fff; PADDING-TOP: 0px; BORDER-BOTTOM: #3377e3 1px solid
} /*按钮的样式,可根据空间的色调等适当调整, BACKGROUND是按钮的背景颜色,COLOR是按钮上面的”百度搜索”的文字颜色,可以按需修改后面的数值*/
#m_search input.text {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 2px 4px; COLOR: blue; BORDER-TOP-STYLE: none; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND: #ade75b; BORDER-BOTTOM-STYLE: none
} /*搜索框样式. COLOR是搜索框内输入内容的文字颜色,BACKGROUND是搜索框背景颜色*/

上面的代码适合不喜欢”花哨”的朋友们.接下来的代码就是比较”个性”的了.

代码也不复杂，就是把上面的 换成：url(图片地址)，就可以个包含图片的漂亮模块啦！~~~

效果：

个性样式代码:
——————————————————————————–
#m_search {
MARGIN: 2px 5px 2px 10px; WIDTH: 242px;height:93px;BACKGROUND:url(http://w3pop.com/sucai/icon/bg/22/25.gif);repeat)
}/*根据图片的大小设置，查看图片属性再设置*/
#m_search{
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 11px; PADDING-BOTTOM: 10px; MARGIN: 0px; COLOR:black; LINE-HEIGHT: 100%; PADDING-TOP: 10px
}

#m_search input.submit{BACKGROUND:url(http://w3pop.com/sucai/icon/gif/sousuo/18.gif);no-repeat ; WIDTH: 70px; height:27px;
BORDER-RIGHT: #3377e3 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #3377e3 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; PADDING-BOTTOM: 0px; MARGIN-LEFT: 4px; OVERFLOW: hidden; BORDER-LEFT: #3377e3 1px solid; letter-spacing:1000000px; PADDING-TOP: 0px; BORDER-BOTTOM: #3377e3 1px solid
}/*这部分代码是去掉按钮上的文字用的，不要改！*/

#m_search input.text {BACKGROUND:url(http://w3pop.com/sucai/icon/gif/yinyue/10.gif);repeat ; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 2px 4px; COLOR: blue; BORDER-TOP-STYLE: none; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none
}
顺便给点素材:

原创文章,转载请注明出处:52abc_Abc’s space http://hi.baidu.com/52abc