index.html 20.6 KB
<html>

<head>
    <!-- META DATA -->
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="description" content="Free Bootstrap Themes - Free Responsive Html5 Templates">
    <meta name="author" content="#">

    <title>虚拟学习网站</title>

    <!-- Bootstrap Core CSS -->
    <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">
    <!-- <link rel="stylesheet" href="css/bootstrap1.min.css" type="text/css"> -->

    <!-- Owl Carousel Assets -->
    <link href="owl-carousel/owl.carousel.css" rel="stylesheet">
    <!-- <link href="owl-carousel/owl.theme.css" rel="stylesheet"> -->

    <!-- Custom CSS -->
    <link rel="stylesheet" href="css/style.css">
    <link href="./css/owl.css" rel="stylesheet">
    <!-- Custom Fonts -->
    <link rel="stylesheet" href="font-awesome-4.4.0/css/font-awesome.min.css" type="text/css">
    <link href='http://fonts.googleapis.com/css?family=Asap:400,700' rel='stylesheet' type='text/css'>
    <link href="./css/responsive.css" rel="stylesheet">

</head>

<body>
    <header>
        <nav>
            <div class="header-txt1">
                <div class="header-img1">
                    <img src="./img/portfolio/B1.png">
                </div>
                <div class="header-right1">
                    <a class="header-btnL" href='login.html'>
                        <div class="header-loginBtn">&nbsp;&nbsp;</div>
                    </a>
                    <!-- <a class="header-btnL" href="aboutUs.html">
                        <div class="header-loginBtn">加入我们</div>
                    </a> -->
                    <a class="header-right-btn" onclick="setPersonal()">
                        <!-- <a class="header-right-btn" href="personalCenter.html"> -->
                        <img src="./img/portfolio/circle.png" style="width: 50px;height: 50px;">
                    </a>
                </div>
            </div>
        </nav>
        <div class="header-text hidden-xs" style="padding-left: 70px;">
            <div class="col-md-12 text-center" style="width: 58%;">
                <p id="onefields1" style="color:#66CA94"></p>
                <h1 id="onefields2"></h1>
                <div style="padding-top: 70px;display: flex;place-items: center;">
                    <h5 style="position: absolute;background-color: #97dab6;border-radius: 50%;z-index: 2;width: 40px;height: 40px;">&nbsp;</h5>
                    <a onclick="morebro()" style="position: relative;left: 25px;color: #323232; z-index: 5;">浏览实习项目</a>
                </div>

            </div>
        </div>

    </header>

    <div id="page-content">
        </section>
        <section>
            <a class="portfolio-box">
                <img src="img/portfolio/C2.png" class="img-responsive" alt="">
            </a>
        </section>

        <!-- 四个小图 -->
        <section class="box-content box-7" id="team">
            <div class="container4">
                <div class="row1" id="fourGroups">
                </div>
            </div>
        </section>
        <!-- 左图右字 -->
        <section class="section padding-top-70 padding-bottom-01" id="features" style="background-color: #f0f0f0;">
            <div class="container">
                <div class="row">
                    <div class="col-lg-5 col-md-12 col-sm-12 align-self-center" id="oneimg1" data-scroll-reveal="enter left move 30px over 0.6s after 0.4s">
                        <img id="oneimg1" src="img/portfolio/E1.png" class="rounded img-fluid d-block mx-auto" alt="">
                    </div>
                    <div class="col-lg-1"></div>
                    <div class="col-lg-6 col-md-12 col-sm-12 align-self-center mobile-top-fix">
                        <div class="left-text">
                            <p id="twofields1" style="color: #66CA94;"></p>
                        </div>
                        <div class="left-heading">
                            <h2 id="twofields2" class="section-title"></h2>
                        </div>
                        <div class="left-text">
                            <p id="twofields3"></p>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-12">
                        <div class="hr"></div>
                    </div>
                </div>
            </div>
        </section>

        <!-- 企业实习项目 -->
        <section class="box-content box-123" id="projects">
            <div style="padding-right:15px;padding-left:10%;padding-bottom: 20px;">
                <div class="intro" style="color: #66CA94;text-align: left;" id="threefield1"></div>
                <div style="display: flex; justify-content: space-between;">
                    <h2 id="threefield2"></h2>
                    <h2><a onclick="morebro()">浏览更多></a></h2>
                </div>
            </div>
            <!-- </div> -->
            <!-- 实习项目-->
            <div class="portfolio-items-container" id="enterpriseProject" href='profile.html'>
            </div>
        </section>

        <section class="section padding-top-70 padding-bottom-01" id="features" style="background-color: #323232;">
            <div class="container " style="z-index: 10; ">
                <div class="row ">
                    <div class="col-lg-5 col-md-12 col-sm-12 align-self-center" data-scroll-reveal="enter left move 30px over 0.6s after 0.4s">
                        <img src="img/portfolio/F1.png " class="rounded img-fluid d-block mx-auto" alt=" ">
                    </div>
                    <div class="col-lg-1"></div>
                    <div class="col-lg-6 col-md-12 col-sm-12 align-self-center mobile-top-fix">
                        <div class="left-text ">
                            <p style="color: #66CA94; " id="fourfields1 "></p>
                        </div>
                        <div class="left-heading">
                            <h2 id="fourfields2" class="section-title " style="color: #66ca94"></h2>
                        </div>
                        <div class="left-text">
                            <p id="fourfields3" style="color: #fff;padding-top: 6%; "></p>
                        </div>
                        <div class="left-text">
                            <ul type='square' style="color: #fff; ">
                                <li>在正式进入实习前,同学们将得到行业最资深老师的专业知识培训,全面掌握了解特定行业、公司及各细分领域的系列专业知识。</li>
                                <li>进入虚拟实习体验项目后,同学们将得到该岗位的一系列工作任务,以及相关参考资料,在导师的悉心指导下挑战完成工作任务</li>
                                <li>工作任务结束后,可获得实习证明,简历纳入企业人才储备库,加入全球start-line优秀校友会,线上线下获取最新最优机会。</li>
                            </ul>
                        </div>
                        <div style="padding-top: 70px;display: flex;place-items: center;">
                            <h5 style="position: absolute;background-color: #97dab6;border-radius: 50%;z-index: 2;width: 40px;height: 40px;">&nbsp;</h5>
                            <a onclick="morebro()" style="position: relative;left: 25px;color: #fff; z-index: 5;">浏览实习项目</a>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <!-- 测试 -->
        <section class="training-section bg-color-2">
            <div class="pattern-layer"></div>
            <div class="auto-container">
                <div class="four-item-carousel owl-carousel owl-theme owl-dots-none">
                    <div class="training-block-one">
                        <div class="inner-box">
                            <div class="content-box">
                                <figure class="image-box"><img src="./img/training-1.jpg" alt=""></figure>
                                <div class="text">
                                    <h4>Citizenship Test</h4>
                                </div>
                            </div>
                            <div class="overlay-box">
                                <div class="text">
                                    <h4>Citizenship Test</h4>
                                    <p>Integer lobortis se conseqat nulla viverra lorem dapibus prodent diam ipsum ...</p>
                                    <a href="index.html"><span>Read More</span><i class="flaticon-send"></i></a>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </section>


        <section class="box-content box-4" id="services" style="background-color: #f0f0f0; ">
            <div class="container">
                <div class="row heading">
                    <div class="col-lg-12" style="text-align: left; ">
                        <div class="intro" id="fivefields1" style="color: #66CA94;"></div>
                        <h2 id="fivefields2">学长学姐分享</h2>

                    </div>
                </div>
            </div>

            <div class="row">
                <div class="box1">
                    <div id="goleft">
                        <div id="gols">
                            <div id="goleft1">
                                <div class="col-lg-31 col-md-6 text-center" style="background-color: #fff;margin: 10px; ">
                                    <div class="service-box">
                                        <div style="display: flex;place-items: center;padding-left: 5%; ">
                                            <img src='img/portfolio/H1.png' style="width: 30%; ">
                                            <div style='display:flex;flex-direction: column;padding-left: 8%;'>
                                                <h3>张同学</h3>
                                                <p>加入START_LINE已有3个月</p>
                                            </div>
                                        </div>
                                        <p class="text-muted" style="padding-top: 5%;font-size: 0.5em; ">Start——line提供了各种不同行业不同角色的真实职场工作体验机会,通过不同项目的完成,我可以快速深入了解各类型工作及企业的真实状态及企业文化情况, 使自己可以清晰透彻的评估自身性格特点,优势劣势,与职位及企业的匹配程度,在信息充分。。。
                                        </p>
                                    </div>
                                </div>
                                <div class="col-lg-31 col-md-6 text-center" style="background-color: #fff;margin: 10px; ">
                                    <div class="service-box">
                                        <div style="display: flex;place-items: center;padding-left: 5%; ">
                                            <img src='img/portfolio/H1.png' style="width: 30%; ">
                                            <div style='display:flex;flex-direction: column;padding-left: 8%;'>
                                                <h3>张同学</h3>
                                                <p>加入START_LINE已有3个月</p>
                                            </div>
                                        </div>
                                        <p class="text-muted" style="padding-top: 5%;font-size: 0.5em; ">Start——line提供了各种不同行业不同角色的真实职场工作体验机会,通过不同项目的完成,我可以快速深入了解各类型工作及企业的真实状态及企业文化情况, 使自己可以清晰透彻的评估自身性格特点,优势劣势,与职位及企业的匹配程度,在信息充分。。。
                                        </p>
                                    </div>
                                </div>
                                <div class="col-lg-31 col-md-6 text-center" style="background-color: #fff;margin: 10px; ">
                                    <div class="service-box">
                                        <div style="display: flex;place-items: center;padding-left: 5%; ">
                                            <img src='img/portfolio/H1.png' style="width: 30%; ">
                                            <div style='display:flex;flex-direction: column;padding-left: 8%;'>
                                                <h3>张同学</h3>
                                                <p>加入START_LINE已有3个月</p>
                                            </div>
                                        </div>
                                        <p class="text-muted" style="padding-top: 5%;font-size: 0.5em; ">Start——line提供了各种不同行业不同角色的真实职场工作体验机会,通过不同项目的完成,我可以快速深入了解各类型工作及企业的真实状态及企业文化情况, 使自己可以清晰透彻的评估自身性格特点,优势劣势,与职位及企业的匹配程度,在信息充分。。。
                                        </p>
                                    </div>
                                </div>
                                <div class="col-lg-31 col-md-6 text-center" style="background-color: #fff;margin: 10px; ">
                                    <div class="service-box">
                                        <div style="display: flex;place-items: center;padding-left: 5%;">
                                            <img src='img/portfolio/H1.png' style="width: 30%;">
                                            <div style='display:flex;flex-direction: column;padding-left: 8%;'>
                                                <h3>张同学</h3>
                                                <p>加入START_LINE已有3个月</p>
                                            </div>
                                        </div>
                                        <p class="text-muted" style="padding-top: 5%;font-size: 0.5em; ">Start——line提供了各种不同行业不同角色的真实职场工作体验机会,通过不同项目的完成,我可以快速深入了解各类型工作及企业的真实状态及企业文化情况, 使自己可以清晰透彻的评估自身性格特点,优势劣势,与职位及企业的匹配程度,在信息充分。。。
                                        </p>
                                    </div>
                                </div>
                            </div>
                            <div id="goleft2"></div>
                        </div>
                    </div>
                </div>
            </div>

        </section>
        <!-- 问题 -->
        <section class="box-content box-8 box-style-4" id="contact" style="background-color: #FCFBFD;color: #323232; ">
            <div class="container">
                <div class="row heading">
                    <div class="col-lg-12" style="text-align: left;">
                        <div id="sixfields1" class="intro" style="color: #66CA94; "></div>
                        <h2 id="sixfields2" style="color:#323232"></h2>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-6 box-item" id="clickQuestion">
                        <p id="answer1" style="color:#323232"></p>
                    </div>
                </div>
            </div>
        </section>

        <!-- 绿底字 -->
        <section class="box-content box-8 box-style-4" style="background-color: #66ca94;">
            <div class="container" style="color: #fff;text-align: center;">
                <p id="sevenfields1"></p>
                <h3 id="sevenfields2"></h3>
            </div>
        </section>
        <!-- FOOTER -->
        <footer>
            <div class="wrap-footer" style="background-color: #323232;">
                <div class="container">
                    <div class="row" style="display: flex;justify-content: space-between;">
                        <div class="col-footer col-md-3" style="display: flex;flex-direction: column;place-content: center;">
                            <img src="img/portfolio/B2.png" width="50%">
                            <p class="footer-title" style="color: #fff;padding-top: 10%;font-size: 0.8em; ">成功职场第一步,从Start-Line开始</p>
                        </div>
                        <div class="col-footer col-md-3 widget_recent_entries" style="display: flex;flex-direction: column;place-items: center;place-content: center;">
                            <a class="footer-title" href="index.html">网站导航</a>
                            <a class="footer-title" href="index.html">网站首页</a>
                            <a class="footer-title" href="participated.html">实习项目</a>
                        </div>
                        <div class="col-footer col-md-3" style="display: flex;flex-direction: column;place-items: center;place-content: center;">
                            <a class="footer-title" href="index.html">关于我们</a>
                            <a class="footer-title" href="index.html">关于Start-Line</a>
                            <a class="footer-title" href="participated.html">联系我们</a>
                        </div>
                        <div class="col-footer col-md-3" style="display: flex;flex-direction: column;place-items: center;place-content: center;">
                            <h2 class="footer-title">关注Start-Line</h2>
                            <img src="img/portfolio/EWM.png" style="width: 50%;">
                        </div>

                    </div>
                </div>
            </div>

        </footer>
        <script type="text/javascript">
            //图片滚动JS代码 
            var speed2 = 20;
            var FGgoleft = document.getElementById('goleft');
            var FGgoleft1 = document.getElementById('goleft1');
            var FGgoleft2 = document.getElementById('goleft2');
            FGgoleft2.innerHTML = FGgoleft1.innerHTML

            function Marquee2() {
                if (FGgoleft2.offsetWidth - FGgoleft.scrollLeft <= 0) {
                    FGgoleft.scrollLeft -= FGgoleft1.offsetWidth
                } else {
                    FGgoleft.scrollLeft++;
                }
            }
            var MyMar2 = setInterval(Marquee2, speed2)
            FGgoleft.onmouseover = function() {
                clearInterval(MyMar2)
            }
            FGgoleft.onmouseout = function() {
                MyMar2 = setInterval(Marquee2, speed2)
            }
        </script>
        <style type="text/css">
            .box1 {
                margin: 0 auto;
                height: 35%;
                width: 100%;
                padding: 10px;
                /* border: 1px solid #FF0000; */
            }
            
            .box1 img {
                margin-right: 20px;
            }
            
            #goleft {
                width: 100%;
                height: 100%;
                overflow: hidden;
            }
            
            #goleft #gols {
                width: 33100px;
            }
            
            #goleft1,
            #goleft2 {
                width: auto;
                float: left;
            }
        </style>
        <!-- jQuery -->
        <script type="text/javascript" src="js/jquery-2.1.1.js"></script>
        <script type="text/javascript" src="js/bootstrap.min.js"></script>
        <!-- Custom Theme JavaScript -->
        <script src="./js/agency.js"></script>

        <!-- Plugin JavaScript -->
        <script src="js/jquery.easing.min.js"></script>
        <script src="js/classie.js"></script>
        <script src="js/owl.carousel.min.js"></script>
        <script src="js/cbpAnimatedHeader.js"></script>
        <script src="./index.js"></script>
        <script src="./js/script.js"></script>

        <!-- carousel -->
        <script src="./owl-carousel/owl.carousel.js"></script>
        <script src="./owl-carousel/owl.carousel.min.js"></script>
        <script>
            $(document).ready(function() {
                $("#owl-brand ").owlCarousel({
                    autoPlay: 3000,
                    items: 1,
                    itemsDesktop: [1199, 1],
                    itemsDesktopSmall: [979, 2],
                    navigation: false,
                    navigationText: ['<i class="fa fa-chevron-left fa-5x "></i>', '<i class="fa fa-chevron-right fa-5x "></i>']
                });
            });
        </script>
</body>

</html>