Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. You can use the CSS from another Pen by using it's URL and the proper URL extention.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <link href="https://fonts.googleapis.com/css?family=Prociono" rel="stylesheet">

  <div class="jumbotron">
  <div class="text-center" id="head">
<h1>Battlefield 1</h1>
  </div>
  <div class="text-center" id="head2"
  <h3><em>"All Out War"</em></h3>
    <body>
      <div class="container" id="img">
 <a href"#"> <img src="https://data1.origin.com/content/dam/originx/web/app/games/battlefield/battlefield-1/screenshots/battlefield-1/1038423_screenhi_930x524_en_ww_blaster_v1.jpg"></a>
      </div>
</div>
</div>
  <body>
    <div class="container">
    <div class="row">
      <div class="col-xs-12">
  <p><h2 class=:"text-danger">Overview</h2>
    While many elements from past installments return, Battlefield 1 presents vehicles in a much more prominent role than commonly seen in WWI settings, featuring first-generation tanks, bi- and triplanes, and airships. Unarmored cavalry—soldiers on horseback—will also make a first appearance. Due to the prevalence of trench warfare during World War I, melee combat features an increased focus from past installments. Chemical weapons like Mustard Gas, which were used extensively during World War I, are also present and can be combated via a vision-obscuring Gas Mask.
  </p><h2>Single-Player</h2>The singleplayer campaign of Battlefield 1 takes place during World War 1 across six different "War Stories" which revolve around different people in different aspects of the Great War in campaigns such as the Italian Alps and the deserts of Arabia. Unlike past installments, the story offers a much larger sandbox to allow players more choice and variety in how they approach different situations.[1]

The singleplayer features Codex Entries which require specific actions to be completed in order to unlock. Once obtained, Codexs give players insight over World War I history. Field Manuals are collectibles introduced and can be found throughout each war story. Weapon Crates also return, featuring a variety of weaponry and gadgets that can greatly affect gameplay by allowing players to change tactics depending on the situation. Crates also feature Singleplayer exclusive variants of weapons such as suppressed sidearms.
</p>
<p><h2>Multiplayer</h2>Battlefield 1's multiplayer has one hundred and ten ranks. There are thirty-four medals in the game, each being able to be earned one hundred times. Medals still require the completion of specific criteria to unlock, with three to five tiers needing to be completed in order to be awarded the medal. Unlike past installments, however, players may only earn five medals a week and have the option to choose what medal to work towards. Only one medal may be tracked at a time though other medals may be tracked if the player changes their kit or gamemode. At the end of each week, the progression for these medals is reset and rotated out for another set of five medals.[2]

Ribbons were first introduced in the Community Test Environment and were added to the retail game on February 14, 2017 in the Winter Update. Similar to past installments, they are awarded upon completion of specific tasks in a round and can be obtained more than once. They have no relation to the unlocking of Medals.

Similar to Assignments, Codex Entries are also introduced and are unlocked through the completion of certain tasks. Once unlocked they will give players greater insight on the history of World War I. Elite Codex were added in the Winter Update on February 14, 2017 and award 25,000 XP upon completing them.
</p>
</div>
</div>
</div>

<div class:"row" id="h2"><h3>Why Choose Battlefield:</h3>
</div>
  <ul class="list-unstyled">
    
    <li>64 Player Multiplayer Matches</li>
    <li>Play as Assault, Medic, Support or Scout</li>
    <li>Multiplayer Maps from actual WW1 locations</li>
    <li>Vehicle Classes</li>
    <li>ELITE Classes</li>
    <li>Map Packs</li>
    <li>Team (Squad) Play</li>
</ul>
</body>
<footer>
<div id="text-center">
 For more information, visit:<a href="www.battlefield.com"> Battlefield.com</a>
  </div>
    <div id="text-center">
  This Tribute Page was created by Mike Brouwer
      </div>
    </div>
    <div>
      <div>
</div>
      </footer>
              
            
!

CSS

              
                body{
  background:black;
  color:white;
  font-family: 'Prociono', serif; 
  text-align:justify;
  margin-top:-25px
}
.jumbotron{
  background:grey;
}
.col-xs-12{
  padding-top:15px;
  line-height:30px;
  margin-left:50px;
  margin-right:50px;
}
h2{
  text-align:center;
  padding-bottom:25px;
  padding-top:25px
   }
#h2{
  text-align:center;
  margin-botton:10px;
  padding-top:25px;
  padding-bottom:25px;
  color:red
}
ul{
  list-style:none;
  padding-top:10px;
}
li{
  font-size:20px;
  line-height:25px;
  line-spacing:20px;
  text-align:center;
  color:red;
}
#head{
  color:black;
 line-height:45px;
  margin-top:5px;
  margin-bottom:15px;
}
#head2{
  color:black;
}
#footer{
  text-justify:center;
}
#text-center{
  text-align:center;
}

              
            
!

JS

              
                
              
            
!
999px

Console