Bootstrap Resumé: the first step
Bootstrap is a framework for web pages created by Twitter employees. It uses a grid system, dividing each page into 12 vertical cells to control layouts. Out of the box it provides "responsive" layouts that change according to the width of the screen you use on your computer.
Create a new page from the Starter Templates for a
The other thing to do first is to create a blank stylesheet called something like cv.css for your specific styling that overrules the standard bootstrap styling: i.e. it should be linked in the head of the cv.htm after the bootstrap.css.
File Menu has an
Attach Style Sheet option but check the code to ensure it is properly placed.
F10 will call up the
Unlike other Dreamweaver Starter Templates, the Bootstrap specimens are poorly commented.
To get a proper WYSYWYG (what-you-see-is-what-you-get) view in Dreamweaver I had to set the display to Live View.
N.B. Dreamweaver wants you to hook up to
bootstrap.css but gave me the wrong link. You too may need to change the default link, and I prefer to link to the minified version,
bootstrap.min.css, then change tags in my separate css file, here
cv.css. You know where to find the
File|Attach Style Sheet command. Just make sure it comes after the bootstrap stylesheet in the head section.
Replace the defaults
To ensure you have the latest version of Bootstrap, once you have created your page with the Dreamweaver defaults, you can replace the head specifications with the online versions (currently 4.3.1) , though you will need to have an internet link to view it. Here's the code (ignore the line breaks):
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script> <link rel="stylesheet" href="readable.css" rel="stylesheet">