У меня возникли некоторые проблемы с использованием Bootstrap в первый раз. По какой-то причине, независимо от того, какие изменения я делаю в своем собственном css, это не влияет на загрузочный css или обычный html макета. В настоящее время я пытаюсь создать свой первый веб-сайт в visual studio, и мне посоветовали работать с начальной загрузкой, однако я не могу заставить его работать так, как я хочу. Я успешно создал нужные веб-элементы без использования bootstrap, однако, когда я пытаюсь использовать bootstrap, он просто не хочет отображать какие-либо мои собственные css, независимо от того, что я делаю.
Как я уже говорил выше, первое, что я попробовал, - это непосредственное редактирование начальной загрузки css, что никак не повлияло на макет моих веб-страниц. После этого я обнаружил, что было бы неплохо создать отдельный файл main.css, а затем связать его с файлом начальной загрузки, при этом любые изменения, вносимые в файл main.css, должны изменить загрузочный css без необходимости загружать загрузчик файл. Однако, используя этот метод, ни одно из изменений никак не влияет на способ отображения веб-страниц. После этого я решил пошагово следовать этому уроку https://websitesetup.org/bootstrap-tutorial-for-beginners/, хотя это учебник по Notepad ++, а не учебник по визуальной студии. Даже после этого пошагового руководства ни одно из изменений, внесенных в CSS, не отображается на веб-странице.
Когда я просто добавляю html, который я хочу, на страницу макета, не связывая bootstrap или main.css со страницей макета, функции работают как задумано, но я не могу настроить некоторые вещи с помощью html, поэтому мне нужно, чтобы он работал с css .
Я провел несколько поисков Google в поисках решений этой проблемы и попробовал несколько, например, переместил код из тела страницы макета в нижний колонтитул, убедившись, что каталог файлов для файлов .css правильный, включая заглавные буквы, но я не могу найти, где проблема.
Вот как я связал свою страницу макета с файлом main.css, который содержит css для изменения панели навигации моих веб-страниц:
<head>
<link rel="stylesheet" type="text/css" href="Main.css">
this is the link to the Main.css file with my custom .css that I used in the layout view in visual studio
<link rel="stylesheet" href="BSProject/css/bootstrap.min.css">
This is the link to the bootstrap file I used when following the above tutorial and added this to the head of the index.html file
<title>Home</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
Это то, что я поместил в свой файл main.css, а также нашел классы .nav в bootstrap.css и попытался также поместить эту информацию в файл начальной загрузки.
/* The navigation bar */
.navbar {
overflow: hidden;
background-color: #333;
position: fixed; /* Set the navbar to fixed position */
top: 0; /* Position the navbar at the top of the page */
width: 100%; /* Full width */
}
/* Links inside the navbar */
.navbar a {
float: left;
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
/* Change background on mouse-over */
.navbar a:hover {
background: #ddd;
color: black;
}
/* Main content */
.main {
margin-top: 30px; /* Add a top margin to avoid content overlay */
}
Я пытаюсь изменить цвет навигационной панели, цвет текста, цвет текста при прокрутке, цвет текста на навигационной панели страницы, которая просматривается в данный момент, текст введите / size / position, и я хочу, чтобы навигационная панель была зафиксирована в верхней части страницы, чтобы при прокрутке страницы все еще можно было видеть навигационную панель в верхней части окна. И я хочу, чтобы навигационная панель масштабировалась в соответствии с размером окна для мобильных пользователей, эта функция включена в начальную загрузку. Я понимаю, что все, что я упомянул, отсутствует в вышеупомянутом css, потому что я хотел проверить его работоспособность до того, как начал печатать все необходимые css.
Я уже могу делать все это без использования начальной загрузки, но для этого проекта мне нужно его использовать, и я просто не могу отобразить ничего, кроме навигационной панели начальной загрузки по умолчанию, независимо от того, что я изменяю в CSS.