Anchor Tags to lead to different Layouts?-CodePudding

im sure it is an easy question but i can't find the solution.

So i build the one page with 3 Anchor Tags that look like buttons. Now when i click on one of those buttons i want it to guide me to another Layout that i prepared.

Example: www.test.com Clicks on one Anchor Tag page is now www.test.com/button1

Now the second question is: Where do i design this www.test.com/button1.

I was thinking of React and Routing but i dont know what the easiest way is. As it will be about 35 different Layouts i think it would be easiest to have a JavaSciprt Class for every Layout i create.

Im really hoping for help. Thank you!

PS:I already bought a frontend course on udemy

CodePudding user response：

The better way is to use the react router dom its better than JavaScript

CodePudding user response：

You can create a sub-directory called button1, and put an index.html file in there. That should do it.

CodePudding user response：

As you can see, in the first anchor tag i have put the path in href where the file hasbeen saved which i want to link in button1. Here, 'foldername' is the parent folder, then sub folder and finally the index file which you want to link in button1. In the second anchor tag the index file is saved in the 'foldername'.There has not any sub-folder in 'foldername'. And if your index file (which you want to link) is saved in your present folder where you code then just put the name in href as i have done in button3. So, put a front-slash(/) to enter in a folder and put a dot(.) to go back from any folder.

  a {
            padding: 10px 30px;
            text-decoration: none;
            background-color: aquamarine;
            border-radius: 20px;
            display: inline-block;
        }

<body>
    <a href="./foldername/sub-folder/index.html">Button1</a>
    <a href="./foldername/index.html">Button2</a>
    <a href="index.html">Button3</a>
</body>