130 lines
3.9 KiB
HTML
Executable File
130 lines
3.9 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang="en-US">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="author" content="Nicholas Tamassia">
|
|
<title>CSP Test</title>
|
|
<!-- Insert your CSP policies here. Do not change anything else in this file. Well, okay,
|
|
you can change your name as the author just above this comment. -->
|
|
|
|
<link rel="stylesheet" href="https://w3.cs.jmu.edu/kirkpams/343/labs/lab11/styles.css">
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
|
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
|
|
<link rel="stylesheet" href="styles.css">
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<nav class="nav">
|
|
<a class="nav-link border bg-light" href="local.html">Local</a>
|
|
<a class="nav-link border bg-light" href="bootstrap.html">Bootstrap</a>
|
|
<a class="nav-link border bg-light" href="noframe.html">No frame</a>
|
|
</ul>
|
|
</nav>
|
|
|
|
<div class="container">
|
|
<div class="row my-4">
|
|
<div class="col-4 my-2">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<p class="h4">Inline CSS</p>
|
|
</div>
|
|
<div class="card-body">
|
|
<p style="font-size: 2em;">Large text</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-4 my-2">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<p class="h4">Local CSS file</p>
|
|
</div>
|
|
<div class="card-body">
|
|
<p class="h5">Level 5 heading</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-4 my-2">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<p class="h4">Remote CSS file</p>
|
|
</div>
|
|
<div class="card-body">
|
|
<p class="h6">Level 6 heading</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-4 my-2">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<p class="h4">Inline JavaScript</p>
|
|
</div>
|
|
<div class="card-body">
|
|
<p>
|
|
<script>document.write('This is inline scripting');</script>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-4 my-2">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<p class="h4">Local JS file</p>
|
|
</div>
|
|
<div class="card-body">
|
|
<p>
|
|
<script src="local.js"></script>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-4 my-2">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<p class="h4">Remote JS file</p>
|
|
</div>
|
|
<div class="card-body">
|
|
<p>
|
|
<script src="https://w3.cs.jmu.edu/kirkpams/343/labs/lab11/remote.js"></script>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-4 my-2">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<p class="h4">Display an image</p>
|
|
</div>
|
|
<div class="card-body">
|
|
<img src="https://w3.cs.jmu.edu/kirkpams/images/JMU-Logo-RGB-horiz-purple.png" width="100%" height="50px"
|
|
alt="Image should not load due to CSP">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-4 my-2">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<p class="h4">Local image in iframe</p>
|
|
</div>
|
|
<div class="card-body">
|
|
<iframe src="JMU-Logo-RGB-horiz-purple.png" width="100%" height="50px"></iframe>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-4 my-2">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<p class="h4">Remote image in iframe</p>
|
|
</div>
|
|
<div class="card-body">
|
|
<iframe src="https://w3.cs.jmu.edu/kirkpams/images/JMU-Logo-RGB-horiz-purple.png" width="100%"
|
|
height="50px"></iframe>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
</html> |