Also, do you know how can I change the color of a menu link when I put the mouse over?
You do this by modifying the CSS rule associated with the link. So for example, let's say you start with a new blank page, and you drag the Navigation Clean component into the page from the component's menu. Now you will see a basic navigation bar with the words "Company Name" on the left, and "First Item" "Second Item" Third Item" "Dropdown" on the right.
So let's say you want to change the color of the links when you hover over them with the mouse. You can start by making sure the HTML/Style panel below the page is expanded so you can see the page's HTML and CSS. The CSS rules are shown on the right. If you click on the "First Item", you will see the information in the lower panels changes to show you what HTML code creates the link (on the left) and what CSS code styles the link (on the right.) If you don't understand CSS, all the different classes will look confusing (.navigation-clean.navbar-light .navbar-nav .nav-link.active, .navigation-clean.navbar-light .navbar-nav .nav-link.active:focus, .navigation-clean.navbar-light .navbar-nav .nav-link.active:hover) but this is how CSS works. The "C" in CSS stands for "cascading" so each one of those periods with a word after it represents a class in the cascade's succession. The four lines below all those classes are the actual rules that those classes will apply to a given HTML element. You can see the first rule is...
color: #8f8f8f;
This is the CSS rule that tells the text in the link what color it should be. In this case, it's telling the link to be light gray when it's active.
Now, if you scroll down just a bit to the second block of CSS, you'll see another bunch of classes followed by two rules...
color: #3743d !important;
background-color: transparent;
These rules are telling the link that it should be a darker gray when the mouse hovers over it, and that the background behind the text should be transparent. The way you know this is because one of the classes is .nav-link:hover. If you click on the little dark gray box next to the #37434d, it will open a color picker, where you will be able to change the color of the text when it's hovered over. So try changing it to red and then hover the mouse over one of the links, and you'll see that it's now changed to red on hover.
Alternately, you could also change the link via the Look & Feel Panel. If you click on one of the links now (let's say the "Second Item"), and scroll down in the Look & Feel panel to the Font options, you'll see that the color is now the red you chose. if you click the drop down menu at the top of the Look & Feel panel that says "Style Attribute", you will see the different CSS classes that are applied to the element on the page you've selected. If you choose the first block of classes, you can then change the color by typing the hex or rgb data in the color field, or by clicking the box which will open the color picker again. Try changing the color to something else, and you'll see that the rule in the CSS at the bottom of the page in the Styles panel will change to match what you've picked from the Look & Feel panel.
In Bootstrap Studio, there are often multiple ways to edit the various components and elements on your site, but they all boil down to modifying (or creating new) CSS. You don't need an external editor to edit the CSS in your Bootstrap Studio site. You can do it all from within the program, but if you feel more comfortable working with an external editor, you can always write the CSS in a different program and then import the saved CSS stylesheet into BSS. Personally, I find it easier and more intuitive to do it directly within BSS.
Hope this helps get you started. If you've never written any CSS before, I highly recommend you take some online courses, or watch some video tutorials first. There is a LOT to learn in CSS, and some things you want to avoid (like inline styles, and excessive use of things like !important.)
Good luck