• 自学前端第三天


    简历第三天

    简历的CSS文件

    body{
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        font-size: 18px;
        font-weight: bold;
        color:white;
        text-shadow: 4px 4px 4px #222222;
        text-align:center;
        1366px;
        height: 768px;
        background-image:url("o_xxx.jpg");
        background-size: 1366px 768px
    }
    #header{
        background: rgb(238, 223, 16);
        margin: 0 40%;
        border-radius: 0px 10px 0px 10px;
    }
    #info{
        text-align: left;
    }
    .name,.age,.sex,.education_background{
        background: #b1a1a1;
         150px;
        border-radius: 0 50% 50% 0 ;
    }
    .name{
        margin: 10px 0 10px 5%
    }
    .sex{
        margin:10px 0 10px 10%
    }
    .age{
        margin:10px 0 10px 15%
    }
    .education_background{
        margin:10px 0 10px 20%
    }
    #work_experience{
        text-align: left
    }
    .headline{
        margin:10px 0 10px 25%
    } 
    .working_time{
        margin:10px 0 10px 20%
    } 
    .working_time{
        margin:10px 0 10px 20%
    } 
    .company_name{
        margin:10px 0 10px 15%
    }
    .profession{
        margin:10px 0 10px 10%
    }
    .saraly{
        margin:10px 0 10px 5%
    }
    #capacity div{
        padding: 8px 10%; 
        float: left;  
        list-style: none;   
        color:#fff;
    }
    
    

    简历的html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>个人简历</title>
        <link rel="stylesheet" href="my_stype.css">
    </head>
    <body>
        <section id="header">小小咸鱼的个人资料</section>
        
        <section id="info">   
            <div class="name">姓名:yang</div>
            <div class="sex">性别:男</div>
            <div class="age">年龄:25</div>
            <div class="education_background">学历:大专</div>
        </section>
        <section id="work_experience">
            <div class="headline">工作经历</div>
            <div class="working_time ">工作时间:2017.5-2019.4</div>
            <div class="company_name">公司名称:浙江xx医疗科技有限公司</div>
            <div class="profession">岗位:QC工程师</div>
            <div class="saraly">工资:8k</div>
        </section>
        <section id = 'capacity'>
            <div style="color: black"><b>拥有证书</b>
            <br>内审员
            <br>化验员
            <br>无菌实验员
            <br>压力容器操作员
            <br>危化品管理员
            </div>
            <div div style="color: black"><b>计算机软件熟练度</b>
            <br>wps:精通
            <br>PS:精通
            <br>会声会影:精通
            <br>ai:熟练
            <br>pycharm:熟练
            <br>VS:熟练
            <br>ae:了解
            </div>
        </section>
    </body>
    </html>
    

    今天效果图

    今天学习到的内容

    #再导入背景为图片时候
    格式为background -image:url("xx")这里链接要有双引号
    #样式设定时候
    好几类设置相同格式化的时候
    比如name和age一起设置
    可以.age,.name{样式内容}
    #关于padding,margin等有4个值要设置的时候
    只设置一个默认4个值都是这个,设置两个前面一个代表上下,后面那个代表左右,设置3个默认最后一个为0
    #关于样式设置可以直接在标签里设置
    <div div style="color: black">如上面的
    

    未完待续

  • 相关阅读:
    PHP面向对象----- 类的自动加载
    PHP基础知识------页面静态化
    Laravel 开发环境搭建
    jenkins相关学习
    markdown语法学习强化
    bind 使用和配置记录
    关于整形和浮点型的格式输出
    函数体中定义的结构体和类型
    Volatile & Memory Barrier
    各种简单排序算法模版
  • 原文地址:https://www.cnblogs.com/pythonywy/p/10890356.html
Copyright © 2020-2023  润新知