网易微专业页面制作期末考试

请按要求完成index.html(页面标题为“网易新闻“)和index.CSS的所有代码:
效果图:

6630287112443278270.png

有一则图片新闻,效果如上,要求如下:
总体:左图右文,总宽度未知,图文之间间距15px
左图:图片地址假设为http://163.com/x.jpg,图片宽高均为100px
右文:字体为宋体,行高为25px,最多显示4行文字
右文中的标题:标题要求单行显示并且超出时显示”…“,标题文字为粗体,大小为16px,黑色
右文中的段落:段落文字大小为14px,颜色为#666

代码实现:



    
        
        index
        
    
    
        
![图片](http://163.com/x.jpg)

标题文字标题文字标题文字标题文字标题文字

段落文字段落文字段落文字段落文字段落文字段落文字段落文字段落文字段落文字段落文字段落文字段落文字段落文字

已知登录表单效果图如下:

网易微专业页面制作期末考试_第1张图片
Paste_Image.png

要求如下:
总体:表单提交地址假设为“/login”
标题:“登录网易通行证”为14px的微软雅黑字体,加粗,行高16px,距离第一个输入框15px;
左边文字:“用户名:”和“密码:”所在列列宽60px,文字为12px的宋体,文字与输入框垂直居中对齐;
输入框:输入框宽200px高20px(含边框),边框粗细为1px,颜色为#ddd,两个输入框以及按钮之间间距为15px
按钮:按钮与输入框左对齐,按钮宽40px高20px,蓝底白字无边框,按钮文字为12px的宋体且水平垂直都居中
请完成以上登录表单的HTML和CSS

代码实现:



    
        
        login
        
    
    
        
    

请完成以下效果图的HTML(不需要写CSS)

网易微专业页面制作期末考试_第2张图片
Paste_Image.png

代码实现:



    
        
        
    
    
        
照片冲印价格详情
相片尺寸 相纸(元/张)
富士 柯达
6寸 0.45 0.6
10寸 3.89 5
运费8元/单,满99元免运费

请按以下效果图和要求完成下拉菜单的HTML和CSS:

网易微专业页面制作期末考试_第3张图片
Paste_Image.png

代码实现:



    
        
        
        
    
    
        
按钮
  • 下拉菜单项
  • 下拉菜单项
  • 下拉菜单项
  • 下拉菜单项

你可能感兴趣的:(网易微专业页面制作期末考试)