PC端网页布局—世纪佳缘(官网页面)
tingyu_
这个作者很懒,什么都没留下…
展开
-
PC端网页布局——世纪佳缘(四)注册登录
效果如下:页面解析:在这个注册框中呢,可以分为三个部分 1.标题 2.输入框 3.注册/登录重点自然是在注册框了,在注册框中,我们可以看到, 1.每一行的左边的文字是靠右侧的 2.两次用到单选框,其中在婚姻状况里,有默认选项 3.生日和所在地区是两个不同类型的输入框大家可能会遇到的一些问题:1、背景图偏移,由于背景图较大,所以会出现X轴和Y轴的滚动条,当在body中添加溢...原创 2020-08-02 15:06:46 · 7287 阅读 · 0 评论 -
PC端网页布局——世纪佳缘(三)头部
来看头部,做好的效果图如下:接下来就进入主题吧~~先来分析一下:有两张图片,一个填写账号密码和登录按钮的登录框,其他登录方式,(因为海外登录方式与前面纯图标的不太一样,这里又是只做了个大致的样式,所以就把海外用户登录与忘记密码做在了一个大div块中,大家可以按照自己的想法自行修改)很明显,除了图片,后面的内容做在了一个大块中,其中每一个小块又可以使用div来做,而div是块标签,要想一行显示,就需要使用浮动了初步做好长这样:去掉灰色(body的颜色)和粉色(头部颜色)之后原创 2020-07-27 23:50:47 · 677 阅读 · 0 评论 -
PC端网页布局——世纪佳缘(二)页面初搭建
咱们首先来搭建一下整体的大结构:效果如下:每一块呢,都是使用div块做的,并不难理解除了头部之外,每一块都是外面一个大的div,里面再包一个小的div,也就是所谓的通栏和版心(由于个人问题,版心设置了两个宽度的,大家可以根据个人需求来设计)HTML代码如下所示:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="vi原创 2020-07-27 22:36:48 · 931 阅读 · 0 评论 -
PC端网页布局——世纪佳缘( 一 )效果展示
世纪佳缘这个项目从这里起航:首先大家跟我来看一下效果图吧~~~原创 2020-07-24 19:28:40 · 695 阅读 · 0 评论