CSS中怎样设置一个搜索框?/* 首先,我们需要一个输入框 */ input[type= text ] { /* 设置宽度 */ width: 200px; /* 设置高度 */ height: 30
CSS中怎样设置一个搜索框?
/* 首先,我们需要一个输入框 */ input[type="text"] { /* 设置宽度 */ width: 200px; /* 设置高度 */ height: 30px; /* 设置边框,颜色为灰色,宽度为1像素 */ border: 1px solid #ccc; /* 设置圆角 */ border-radius: 5px; /* 设置内边距,让文字不贴边 */ padding: 5px; } /* 接下来,我们需要一个搜索按钮 */ input[type="submit"] { /* 设置按钮文字 */ value: "搜索"; /* 设置背景颜色,这里为灰色 */ background-color: #ccc; /* 设置边框,和输入框一样 */ border: 1px solid #ccc; /* 设置圆角 */ border-radius: 5px; /* 设置内边距,让文字不贴边 */ padding: 5px; /* 设置文字颜色 */ color: white; } /* 最后,我们把它们结合起来 */ form { /* 把输入框和搜索按钮放在一行 */ display: inline-block; }
使用这些CSS代码,你就可以轻松地设置一个漂亮的搜索框了!
粉丝
0
关注
0
收藏
0