前端学习day10-总结

关键词： 美团登录界面:  头像  昵称  hover

---

登录界面

---

一 . 如何把图片做成圆形头像

border-radius: 50%;

二 . 对昵称的处理

1. 首先先用 overflow:hidden ,表示超出部分则隐藏。如果没超出也可以设置。

2 .white-space: nowrap;  //段落文本不换行。

3. 此时对其设置规定的宽度width  ，昵称会省略显示不出来的文字，

    最后用text-overflow: ellipsis;属性来设置省略的文字用省略号来替代。

对昵称的处理

---

三 . hover 

hover

.btn:hover{

      background-color: #dddddd;

  }

---

备注：此文章根据实例总结而来，访问更多请点我的github