作业一学期三书五章

1.使用font-fanmily属性，同时设置英文字体和中文字体时需要注意什么问题？
把英文字体写在前面，中文的写在后面
2.在CSS中，常用的背景属性有哪几个？他们的作用是什么？
background:#fff url(‘sss.jpg’) no-rerepeat;
颜色，背景图片路径，不循环
还有一个background-size：背景图片的大小
3.制作北大青鸟课程介绍页面（页面效果参见提供的上机练习素材中的页面效果图），页面要求如下。

• 使用《div》，《p》，《span》等标签编辑页面，页面整体背景颜色使用线性渐变（#ECECEC，#FFFFFD）。
• 课程特色字体颜色为绿色（#5C9815），设计理念字体为橙色（#F26522）。
• 课程特色和设计理念每行开头带背景颜色的字体为白色，背景颜色从提供作业素材的页面中获取，使用结构伪类选择器元素。
• 使用外部样式表创建页面样式。

/*整体设定*/
#whole{
    width: 600px;
    background-color: #eeeeee;
    background: linear-gradient(to bottom,#ECECEC,#FFFFED);
}
/*id选择器*/
#whole span{
    color: #ffffff;
}
/*改变字体背景*/
.one{
    line-height:30px;
    color: #5C9815;
}
.one span:nth-of-type(1) {
    background-color:#005952;
}
.one span:nth-of-type(2) {
    background-color:#007236;
}
.one span:nth-of-type(3) {
    background-color:#008bbf;
}
.one span:nth-of-type(4) {
    background-color:#0066b3;
}
.one span:nth-of-type(5){
    background-color:#002561;
}
/*id选择器*/
.two{
    line-height:30px;
    color: #F26522;
}
/*改变字体背景*/
.two span:nth-of-type(1) {
    background-color:#f36f21;
}
.two span:nth-of-type(2) {
    background-color:#bb131a;
}
.two span:nth-of-type(3){
    background-color:#d73765;
}
.two span:nth-of-type(4) {
    background-color:#a70532;
}
.two span:nth-of-type(5) {
    background-color:#553171;
}
.two span:nth-of-type(6){
    background-color:#4f1268;
}

    
    
    
    




    
    

    

    
    

        逆向课程设计： 以企业需求决定课程设计内容，确保训练内容及深度和企业需求
一致

        模拟学员学习路线： 强调难点和复杂技能点的反复训练，力求学习效果和学习体
验

        互联网作为教学环境： 学员的日常教学和训练均在互联网线上进行

        学习挡板监控网上学习效果： 每个学习阶段设置线上线下测试，严密监控学习效
果

        真实开发项目经验积累： 采用专业互联网企业提供的真实项目作为模拟开发

    
    
    

    
    

        【实用性】—— 以就业岗位需求为导向，重点讲解企业80％的时间在使用的20％
的技术

        【权威性】—— 与来自百度等知名企业的专家联合开发

        【专业性】—— 引进业内资深人才和典型行业开发项目

        【真实性】—— 在互联网真实环境下进行教学和训练

        【易学性】—— 在线培训模式，24小时专家在线解答疑难问题

        【完整性】—— 利用SNS虚拟社区：学习、人脉双丰收

    

4.制作席慕容的诗《初相遇》（页面效果参见提供的上机练习素材中的页面效果图），页面要求如下。

• 页面总宽度为400px，整体背景颜色线性渐变（#CAEFFE，#FFFFED）；
• 使用《h1》标签排版文字标题，字体大小为18px，黑色文字阴影。
• 使用《p》标签排版文字正文，首行缩进为2em，行高为22px。
• 首段第一个“美”字，字体大小为18px，加粗显示，黑色和白色文字阴影，具体方向参考素材效果图。第二段中的“胸怀中满溢······在我眼前”字体风格倾斜，颜色为蓝色，字体大小为16px。正文其余文字大小为12px。
• 最后一段文字带下划线。
• 使用外部样式表创建页面样式。
• 页面中的字体颜色从提供作业素材的页面效果图中获取。

/*设定整体*/
body{
    font-size: 12px;
    font-family:Verdana,Arial,Helvetica,sans-serif, "宋体";
    width: 400px;
    height: 400px;
}
/*设置主题部分*/
#whole{
    background: 400px;
    background: linear-gradient(to bottom,#CAEFFE,#FFFFED);
}
/*设置标题*/
h1{
    font-size: 18px;
    color: #0d7dac;
    text-align: center;
    text-shadow: black 1px 1px 1px;
}
/*设置特定字体*/
span{
    font-size: 12px;
    color: #999999;
    font-weight: normal;
}
/*设置p标签的样式*/
p{
    text-indent: 2em;
    line-height: 22px;
}
.one{
    font-size: 18px;
    color:violet;
    font-weight: bold;
    text-shadow: white 2px 2px 2px,black 2px 2px 2px,white -2px -2px 2px;
}
.two{
    font-size: 18px;
    color: #4c67f4;
    font-style: oblique;
}
.three{
    color: #339900;
    text-decoration: underline;
}

    
    
    
    




    
初相遇   文/席慕容
    

        
        美
        丽的梦和美丽的诗一样，都是可遇而不可求的，常常在最没能料到
的时刻里出现。
    
    

        我喜欢那样的梦，在梦里，一切都可以重新开始，一切都可以慢慢解
释，心里甚至还能感觉到，所有被浪费的时光竟然都能重回时的狂喜与感
激。胸怀中满溢着幸福，只因你就在我眼前 ，对我微笑，一如
当年。
    
    
    

        我喜欢那样的梦，明明知道你已为我跋涉千里，却又觉得芳草鲜美，落
落英缤纷，好像你我才初相遇。
    

5.制作淘宝女装分类页面（页面效果参见提供的上机练习素材中的页面效果图），页面要求如下。

• 使用无序列表等HTML标签有语义化的编辑页面。
• 女装各分类名称前的图片使用背景图片的方式实现，标题字体大小为18px，加粗显示。
• 分类内容字体大小为12px，超链接文本字体颜色为黑色，无下划线，当鼠标移至超链接文本字体上时字体颜色为橙色（#F60），并且显示下划线。
• 使用外部样式表创建页面样式。
• 页面中其他的效果样式见提供的作业素材中的页面效果图。

/*设置标题*/
h2{
    font-size: 18px;
    font-weight: bold;
}
/*引用图片当背景*/
.one{
    background: url(../Semester1book3DJ5/dress01.png) 0px 0px no-repeat;
}
.two{
     background: url(../Semester1book3DJ5/dress02.png) 0px 0px no-repeat;
}
.three{
    background: url(../Semester1book3DJ5/dress03.png) 0px 0px no-repeat;
}
.four{
    background: url(../Semester1book3DJ5/dress04.png) 0px 0px no-repeat;
}
.five{
    background: url(../Semester1book3DJ5/dress05.png) 0px 0px no-repeat;
}
/*设置p标签样式*/
p{
    font-size: 12px;
}
/*设置悬停时样式*/
a:hover{
    text-decoration: underline;
    color: #F60;
}

    
    






    

        
        
          夏季流行
        

        

            
            夏季新品
            雪纺裙
            短袖T
            铅笔裤
            短裤
            短袖衬衫
            小脚牛仔裤

            开衫
            蕾丝/雪纺衫
            韩版外套
            小西装
            中长款裙
        
    
    

        
        
          上装
        

        

            
            T恤
            衬衫
            针织衫
            长袖T
            韩版T
            情侣衫
            雪纺衬衫
            韩版衬衫

            防晒衣
            休闲套装
            卫衣
            背心/吊带
        
    
    

        
        
          裙子
        

        

            
            连衣裙
            半身裙
            长裙
            短袖裙
            蕾丝连衣裙
            长袖裙
            无袖/背心
裙
            A字裙
            牛仔裙
            半身中长裙
            半身短裙
            包臀裙
        
    
    

        
        
          裤子
        

        

            
            裤子
            休闲裤
            牛仔裤
            打底裤
            长裤
            哈伦裤
            阔腿裤
            短裤/热
裤
            连体裤
            七/九分裤
            牛仔短裤
            西装裤
        
    
    

        
        
          其他女装
        

        

            
            胖M装
            中老年
            婚纱
            礼服
            旗袍
            夜店
            舞台装
            唐装
            职业装

            全球购
            羊绒衫
            毛衣
            呢大衣
            羽绒服
            真皮皮衣