Custom layout aswell as Bootstrap

Question

I'm going to be re-designing a website that currently uses Bootstrap.

I'm more of a fan of building my own layouts however as this site already uses Bootstrap, I'm unsure how to go about the re-design.

I've never used Bootstrap before (I know how it works from looking at the documentation and videos) but is it possible for me to have parts of a webpage use Bootstrap and other parts not?

For example, say there are 5 sections on a home page. The first section is a full screen hero etc.. then sections 3 and 5 break the grid. Could I use Bootstrap only for sections 2 and 4 but then do my own layout for sections 1, 3 and 5? I'm just curious as to whether or not it would cause problems doing this?

Another example is that we would want something like this on the site: https://codyhouse.co/demo/horizontal-timeline/index.html

I assume the best way to implement that would be outside of Bootstrap? So, this would be a section on a page where I don't use it?

I know we could scrap Bootstrap but not all pages on the site are being re-designed, so Bootstrap is already going to be in use. I'm trying to make parts of the site more interactive and "different", so using Bootstrap would be good for basic layout but I don't want to be fighting with it to achieve my goal.

Thanks!

Answer 1

you have two way to building your own layout

1. Overwrite the css of bootstap , create new css file and write your won styles into it and load embed it after bootstrap.min.css in you code.

2. Avoid use of bootstrap class , because bootstrap is working on classes so avoid to use of bootstrap class.