论坛风格切换
您好,欢迎光临本站!   登录 注册新用户
  • 51483阅读
  • 205回复

[DIV+CSS]【红黑联盟DIV+CSS】一分钟学习[每日更新] [复制链接]

上一主题 下一主题

发帖
59
黑豆
159
威望
84
贡献值
0
交易币
0
红豆
0
只看该作者 40 发表于: 2012-06-24
1条评分黑豆-2
仑羽昆岚 黑豆 -2 请认真发帖,不要无意义灌水 2012-07-14

发帖
5566
黑豆
58
威望
17754
贡献值
0
交易币
0
红豆
86
只看该作者 41 发表于: 2012-06-25
[一分钟学习]文本框美化
 
 
首先在网页中插入一个文本框
<input type="text" name="title" /> 

预览的时候,你会发现,默认的样式好难看,这个时候我们需要对该文本框进行美化,首先,在代码中间加入一个title的样式名称。
<input class="title" type="text" name="title" /> 

然后在css里加入代码,首先我们想要一个橙色的一个像素的实线边框
.title{ border:1px solid #ff6600;}

橙色边框出来后,我们需要定义他的宽度和高度
.title{ border:1px solid #ff6600;width:200px; height:50px;}

在预览的时候发现当你鼠标移到文本框内的时候,光标是在左上角,我们通过代码让其进行垂直居中。
.title{ border:1px solid #ff6600;width:200px; height:50px;line-height:50px;}

然后在对文本框里面的文字设置一个颜色。
.title{ border:1px solid #ff6600;width:200px; height:50px;line-height:50px;color:#333}

预览的时候发现,好像输入文字的时候有点太靠边了,那么再给一个padding-left的值
.title{ border:1px solid #ff6600;width:190px; height:50px;line-height:50px;color:#333; padding-left:10px;}

然后在对文字定型一个定义
.title{ border:1px solid #ff6600;width:190px; height:50px;line-height:50px;color:#333; padding-left:10px;font-size:14px;}
这样预览一下,是比以前好看多了,当然你也可以根据自己的需要继续进行修改和完善。


发帖
5566
黑豆
58
威望
17754
贡献值
0
交易币
0
红豆
86
只看该作者 42 发表于: 2012-06-25
到此一分钟学习基础部分就结束了,而且最近几天会比较忙,DIV+CSS实践部分计划安排在7月2日开始,计划是仿一个站的前台页面,其中会涉及到一个切图部分,新手photoshop不会的也可以跟着看一下,比较简单的。

遇到问题,继续跟帖回复,除六日,基本每天都会在线。
1条评分黑豆+10
仑羽昆岚 黑豆 +10 优秀帖子,支持 2012-07-14

发帖
824
黑豆
1277
威望
1805
贡献值
0
交易币
0
红豆
0
只看该作者 43 发表于: 2012-06-25
必须的、
发帖
1
黑豆
1
威望
1
贡献值
0
交易币
0
红豆
0
只看该作者 44 发表于: 2012-06-26
看看怎么样了
发帖
91
黑豆
59
威望
86
贡献值
0
交易币
0
红豆
0
只看该作者 45 发表于: 2012-06-26
挺好的,学习啦
发帖
9
黑豆
1
威望
9
贡献值
0
交易币
0
红豆
0
只看该作者 46 发表于: 2012-06-27
必须支持
发帖
43
黑豆
14
威望
136
贡献值
0
交易币
0
红豆
0
只看该作者 47 发表于: 2012-06-27
     继续来支持楼主了,谢谢了

发帖
875
黑豆
-2092
威望
1576
贡献值
0
交易币
0
红豆
1
只看该作者 48 发表于: 2012-06-28
收藏了 学习
发帖
6
黑豆
0
威望
6
贡献值
0
交易币
0
红豆
0
只看该作者 49 发表于: 2012-06-29
新人,学习了!
快速回复
限100 字节
 
上一个 下一个