越努力越幸运。
不管如何,我比你努力,比你好,比你更问心无愧。

2017.02.22

教程 | 美化搜索框 (BT/BS)

这篇教程从 PMR 前拖到 holiday 之后。真的是觉得内疚死了、最近被逼着要早睡早起。托它的福,早上 11 点半我睡醒了 (( 众:这样叫很早莫 ? 对我来说那真的是很早了莫,平时是睡到两三点的。oMo 每天早上 4 / 5 点才睡,你们讲啦,想不睡到两三点都不可以 ;(

Okay, 废话太多了。这篇教程不大常看见(当然,我没有说它没有被发布过,也是有教程部落格发布过了)应该有蛮多人都不知道这篇教程吧…… ? 好啦,或许很多人都知道,可是总有一小部分的不知道,这样行了莫 >P< 好滴,废话真的不要再讲了,看教程咩。

To Miharu -
I'm so sorry that promised you to post this tutorial as soon as possible but seem like I'm didn't keep my promise. Sorry. Please forgive me :)


- Tutorial requested by Miharu -

Blog Template 使用者
1. 布局 - 添加小工具 - HTML/JavaScript

2. 将以下代码添加进去:

<center>
<form action="/search" method="get"><input type="text" name="q" value="" style="width:160px; height:19px; background:url(背景 url); color: #000000; font-size: 12px; border: 1px solid #000000;" />
<img src="图片 url" /><br /> <br />
<input type="button" value="Click to Search" style="font-size:12px; color:#000000; background: #cccccc; border:1px dashed #FFEBCD;" /></form></center>

3. 保存即可。

Blogskin 使用者
1. 模板

2. 将上面的代码添加进去你想要搜索框出现的地方

3. 预览看看你想要的效果有没有出现,即可保存。

小解释
# 我将代码分为两个部分来解释噢。的就是搜索框的美化代码的就是搜索键的美化代码

搜索框的美化代码
褐色代码:搜索框的高度、宽度(可以更改成你想要的高度、宽度)
橙色代码:搜索框的背景 url
红色代码:搜索框的字体颜色
蓝色代码:搜索框的字体大小
紫色代码:搜索框的边框粗度、种类、颜色
青色代码:小图标的图片 url(如果不要置放小图标,可将 <img src="图片 url" /> 删除)

搜索键的美化代码
紫色高亮:搜索键里显示的字(可更改成你喜欢的)
蓝色高亮:搜索键里字体的颜色
红色高亮:搜索键的背景色(可改成背景图)
绿色高亮:搜索键的边框粗度、种类、颜色

No comments:

Post a Comment

っ 谢谢你耐心的看完这篇帖子 ♥
っ 评论将在博主审核后发布,如有不便,敬请原谅哦 :)
っ 除了评论之外,亲也可以选择在 Cbox 留言或 PM 我的部落格专页信箱

ベ 请用词确切,勿使用脏字哟
ベ 部落格不接受匿名评论,评论前请确保你拥有 Google Account 哦
ベ 请仔细列明你的问题好方便我回答哦 :)

* 感谢你的留言,欢迎下次再来。