Meet the Team Page

Standard

Are first task towards the making of out web-app was to make a basic Meet the Team page using basic HTML and CSS. We used the previous files we had made in tutorials with Kyle and just input the elements we needed like an image, link to our blogs and a paragraph to put a small bio about all of us.

meet-the-team-code

We had used Bootstrap to make this site by creating some large columns so we could have 3 small sections in the middle of the page. Bootstrap made this process a lot faster as we didn’t have to fiddle around with alignment or much CSS. We could also make our images circle and adding buttons that link to our blog by using one of the elements from the Bootstrap site.

plain-meet-the-team

In the screenshot below it shows us also using the default Bootstrap navigation. This nav bar was exactly what we wanted to use for our project as it was simple and we were able to fix it to the top of the page very easily. This left us with a completed meet the team page and a good shell of a website to build the next part of the code from.

meet-the-team-actual-page-basic

This is the code for the buttons from Bootstrap:

bsbutton

This is the code for the nav bar from Bootstrap:

bsnav

This is the code for the circular images from Bootstrap:

bsimg

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s