自己写的banner图上的表单例子,为什么字体颜色设置没有效果

自己写的banner图上的表单例子,为什么字体颜色设置没有效果

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title></title>

<style type="text/css">

.banner{

margin: 0 auto;

background-color: burlywood;

width: 800px;

height: 500px;

display: flex;

justify-content: center;

align-items: center;

}

input{

width: 500px;

padding: 12px 20px;

margin: 8px 0;

border: 1px solid #ccc;

border-radius: 4px;

box-sizing: border-box;

background-color: rgba(255,255,255,0);

}

</style>

</head>

<body>

<div class="banner">

<form>

<input type="text" name="name" placeholder="your name"/>

<br />

<input type="tel" name="phone" placeholder="your phone" />

</form>

</div>

</body>

</html>

老师 看下这样写对不对?

正在回答

登陆购买课程后可参与讨论,去登陆

2回答

你好,如果在input框中设置字体颜色属性,之后当输入的时候字体颜色才是白色的:

http://img1.sycdn.imooc.com//climg/5d08cf1e000159ac05910157.jpg

如果想要placeholder属性中内容字体为白色,可以添加样式:

http://img1.sycdn.imooc.com//climg/5d08cf360001da7c02680082.jpg

http://img1.sycdn.imooc.com//climg/5d08cf4e000189ac05850177.jpg

自己可以测试下,祝学习愉快!

好帮手慕言 2019-06-18 15:20:48

同学你好,在同学提供的代码里面没有设置字体颜色的样式,设置字体颜色是color属性,

另  input标签在点击时在谷歌浏览器上会有蓝色边框,可以设置outline: none;去除,

如果帮助到了你,欢迎采纳~祝学习愉快

  • 提问者 据说真的有神 #1
    我在input里面添加color没有效果,就先删掉了
    2019-06-18 17:03:05
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师