Skip to content

Instantly share code, notes, and snippets.

@snow8261
Created May 6, 2016 08:29
Show Gist options
  • Select an option

  • Save snow8261/9eba899418b94e28c809ea7ceae08628 to your computer and use it in GitHub Desktop.

Select an option

Save snow8261/9eba899418b94e28c809ea7ceae08628 to your computer and use it in GitHub Desktop.

Revisions

  1. snow8261 created this gist May 6, 2016.
    7 changes: 7 additions & 0 deletions Peter's Web Studio Center.markdown
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,7 @@
    Peter's Web Studio Center
    -------------------------


    A [Pen](http://codepen.io/snow8261/pen/EPdPmP) by [Tongjie](http://codepen.io/snow8261) on [CodePen](http://codepen.io/).

    [License](http://codepen.io/snow8261/pen/EPdPmP/license).
    132 changes: 132 additions & 0 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,132 @@
    <!-- Navbar -->
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
    <div class="container-fluid">
    <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    </button>
    <a class="navbar-brand" href="#">Tongjie Li</a>
    </div>
    <div class="collapse navbar-collapse" id="myNavbar">
    <ul class="nav navbar-nav navbar-right">
    <li class=""><a href="#Home">Home</a></li>
    <li><a href="#About">About</a></li>
    <li><a href="#Portfolio">Portfolio</a></li>
    <li><a href="#Contact">Contact</a></li>
    </ul>
    </div>
    </div>
    </nav>
    <!--Home -->
    <a name="Home"> </a>
    <div class="container-fluid text-center">
    <div class="jumbotron">
    <div class="container">
    <h1 class="margin">Peter's Web Studio Center</h1>
    <div class="page-header">
    <h3 class="">Where amazing happen</h3>
    </div>
    <div class="col-xs-12"><hr class="style1"></div>
    <div class="row ">
    <!--<div class="col-xs-12">-->
    <ul class="list-inline">
    <li><a href="#" class="btn btn-default btn-lg" target="_blank">

    Twitter</a></li>
    <li><a href="#" class="btn btn-default btn-lg" target="_blank">
    <!--<i class="fa-linkedin-square">-->
    Twitter</a></li>
    <li><a href="#" class="btn btn-default btn-lg" target="_blank">

    Twitter</a></li>
    <li><a href="#" class="btn btn-default btn-lg" target="_blank">
    <!-- <i class="fa-linkedin-square">-->
    Twitter</a></li>
    </ul>
    <!-- <div class="btn-toolbar">
    <a href="#" class="btn btn-default btn-lg">
    <span class="glyphicon"></span> Twitter</a>
    <a href="#" class="btn btn-default btn-lg">
    <span class="glyphicon glyphicon-search"></span>GitHub</a>
    <a href="#" class="btn btn-default btn-lg">
    <span class="glyphicon glyphicon-search"></span>Linkedin</a>
    <a href="#" class="btn btn-default btn-lg">
    <span class="glyphicon glyphicon-search"></span>FreeCodeCamp</a>
    </div>-->
    <!--</div>-->
    </div>
    </div>
    </div>
    </div>
    <!--About-->
    <a name="About"> </a>
    <div class="container-fluid">
    <div class="row-fluid">
    <div class="col-sm-4">
    <h3>Peter Web Studio Center</h3>
    <p>I'm a data architector in Telecommunication company living in Shanghai.</p>
    <p>I'm current learning Front end development.</p>
    <p>I was Java developer and Project Manager work on system like Network Management System and Process Management System.</p>
    <p>My passion is using technology to solve real world challenges.</p>
    <p>Haves:</p>
    <p>Languages and Frameworks:</p>
    <p>Java,J2EE,Hibernate,Spring</p>
    <p>Tools and expertise:</p>
    <p>Git</p>
    </div>
    <div class="col-sm-8">
    <div class="well">
    <img src="http://placehold.it/250x150?text=IMAGE" class="img-responsive" style="width:80%" alt="Image">
    </div>
    </div>
    </div>
    </div>
    <!--Portfolio-->
    <a name="Portfolio"> </a>
    <div class="container-fluid text-center">
    <h3>Some of My Work</h3>
    <div class="row">
    <div class="col-sm-3">
    <p>Some text</p>
    <img src="http://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
    </div>
    <div class="col-sm-3">
    <p>Some text</p>
    <img src="http://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
    </div>
    <div class="col-sm-3">
    <p>Some text</p>
    <img src="http://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
    </div>
    <div class="col-sm-3">
    <p>Some text</p>
    <img src="http://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
    </div>
    </div>
    <div class="row">
    <div class="col-sm-3">
    <p>Some text</p>
    <img src="http://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
    </div>
    <div class="col-sm-3">
    <p>Some text</p>
    <img src="http://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
    </div>
    <div class="col-sm-3">
    <p>Some text</p>
    <img src="http://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
    </div>
    <div class="col-sm-3">
    <p>Some text</p>
    <img src="http://placehold.it/150x80?text=IMAGE" class="img-responsive" style="width:100%" alt="Image">
    </div>
    </div>
    </div>
    <!--Contact-->
    <a name="Contact"> </a>
    <footer class="container-fluid text-center">
    <p>Contact:snow8261 at gmail.com</p>
    <p>Power by <a href="#">BootStrap</a></p>
    </footer>
    3 changes: 3 additions & 0 deletions style.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,3 @@
    hr.style1{
    border-top: 0.5px solid #8c8b8b;
    }
    2 changes: 2 additions & 0 deletions styles
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,2 @@
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
    <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" />