day17-网易注册界面

  • 模仿网页地址:http://reg.email.163.com/unireg/call.do?cmd=register.entrance&from=163navi®Page=163
day17-网易注册界面_第1张图片
网易注册界面.png
  • 1.如何实现圆角?

    • 方式一:切左右两张圆角图片,背景水平平铺在在外层,内层嵌套左边再嵌套右边
    • 方式二:border-radius: 3px 3px 0 0;---CSS3新增
  • 2.首行缩进

    • 文字的text-indent: 20px;
  • 3.内容的垂直居中

    • 行高===父元素高度
  • 4.如何让图片在div中水平垂直居中

    • 方式一:在div中设置img测量padding并设置paddingtopleft注意要记得设置box sizing为boderbox
      • 该方式可以设置背景颜色
    • 方式二:div中background: url("") no-repeat center;
      • 该方式无法设置背景颜色
  • 5.如何实现选项卡效果

    • 用ul和li
  • 6.如何实现盒子顶部对齐

    • 利用浮动
  • 7.优化细节

    • 1️⃣最好要写一定的注释
    • 2️⃣清空一些默认样式 a ul li 等
    • 3️⃣利用body设置文字信息
  • 源码



    
    高仿:网易注册界面
    



欢迎注册无限容量的网易邮箱!邮件地址可以登录使用其他网易旗下产品。

  • 注册字母邮箱
  • 注册手机号码邮箱
  • 注册VIP邮箱

* 邮箱地址

@

6~18个字符,可使用字母、数字、下划线,需以字母开头

* 密码

6~16个字符,区分大小写

* 确认密码

请再次填写密码

![](reg_master.gif)

你可能感兴趣的:(day17-网易注册界面)