发表于: 2019-09-18 19:25:41

1 876


调整任务六,提交后师兄指出了两处不足

1、下拉框的宽度过窄

其实是因为,我的下拉框是后加的,之前把病人情况只当按钮放在那里,没有做出了下拉框的效果

后来为了露出旁边的小三角,把下拉框宽度改成了80%

hhh被师兄发现了

然后重新改成了宽度100%,小三角被挤到下面去了

那只能把小三角放在背景里了

select {

    cursor: pointer;

    width: 100%;

    padding-right: .5rem; 

    font-size: 1rem;

    text-align-last: center;

    color: #999;

    border: none; 

    background: url(img/task6-down.jpg) no-repeat  right; /*背景图是小三角图片,不重复,靠右*/

    background-size: 1.2rem; 

    -webkit-appearance: none;  /*这里是去掉默认的下拉框小三角*/

    outline: none; 

}

调整后

2、顶部的按钮没有改成动态的

加上hover实现按钮的变色

button:hover {

    color: #55a8b3;

    background-color: #fff;

}

写代码的时候发现冒号前后不能有空格,否则不起作用

鼠标悬浮上按钮背景变成白色


除了:hover选择鼠标指针浮动在其上的元素,并设置其样式。还有:link选择器设置指向未被访问页面的链接的样式,:visited选择器用于设置指向已被访问的页面的链接,:active选择器用于活动链接。



返回列表 返回列表
评论

    分享到