У меня проблема со ссылкой Bootstrap, которая обычно ведет в файл HTML:
<link rel = "stylesheet" href = "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity = "sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin = "anonymous">
Это делает мою навигацию похожей на:
(Мне нужно как минимум 10 репутации, чтобы публиковать изображения, поэтому я должен опубликовать прямую ссылку) https://i.imgur.com/dANnzzG.png
и после того, как я удалю ссылку:
(Мне нужно как минимум 10 репутации, чтобы публиковать изображения, поэтому я должен опубликовать прямую ссылку) https://i.imgur.com/EpnZCeK.png
Но, как вы можете видеть на картинке 2, если у меня нет ссылки, элементы внизу панели навигации больше не находятся в правильном положении. Пожалуйста помоги.
Обновлено:
<link rel = "stylesheet" href = "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity = "sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin = "anonymous">
<div class = "row">
<div class = "col-6">
<app-list-employees></app-list-employees>
</div>
<div class = "col-6">
<div><app-book-employee></app-book-employee></div>
<p></p>
<div><app-calendar-books></app-calendar-books></div>
</div>
</div>
Это код компонента.
Похоже, что бутстрап работает нормально, когда вы не используете ссылку, стиль, примененный к панели навигации на втором изображении, взят из бутстрапа. предоставьте больше HTML, чтобы мы могли найти проблему. Вы можете использовать stackblitz.com для создания примера
В корне вашего проекта находится файл angular.json
.
Если вы хотите использовать CDN для начальной загрузки (как вы используете сейчас), найдите объект стилей в этом файле (возможно, между строками 25 и 35), туда вы можете добавить свою ссылку. это должно выглядеть так:
"projects": {
"architect": {
"build": {
"styles": [
"https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
]
}
}
}
Какая у вас ошибка? Можете ли вы предоставить больше кода, чтобы я мог посмотреть?
Я получаю такие же стили, как на картинке. Я отредактировал больше кода.
Если вы используете angular 6+ в своем приложении, лучше всего установить bootstrap через npm следующим образом:
npm install --save bootstrap
После установки бутстрапа добавьте эту строку в файл src/style.css:
@import 'bootstrap/dist/css/bootstrap.min.css';
Это даст вам все стили начальной загрузки, поэтому добавлять их в ваш файл index.html
или файл angular.json
не нужно.
вот как импортировать boostrap в angular: stackoverflow.com/questions/50559810/…