Question

忍受我......：我正在尝试创建一个将在预先存在的网站上输入的表单。我不是专业人士，也不是网站的开发者，所以我的目的是在bootstrap隔离css中创建具有js条件格式的表单。我使用的原始资料可以在这里找到：https://formden.com/blog/isolate-bootstrap。我下载了文件，只将bootstrap-iso.css拖到我的主机文件夹中。（不确定我是否应该带上boostrap-theme.css？）

我拿出了表单和条件js，但想在代码片段中向您展示我的问题。我无法让glyphicons与bootstrap iso css一起工作，并且需要知道如何纠正这种情况。在我的代码片段中看到，只有信封glyphicon出于某种原因才有效。当我链接到＆＃34; https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css＆＃34;时，glyphicons工作正常，但我失去了iso方面，我不确定开发人员是否只能填写表单。有人可以向我解释如何让glyphicons工作？我需要将它们用作工具提示悬停。

＆＃13;

<link href="https://formden.com/static/assets/demos/bootstrap-iso/bootstrap-iso/bootstrap-iso.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<html>
	<head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="bootstrap-iso.css" /> 
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
        <style>
        </style> 
	</head>
    

<body>

    
	<div class="bootstrap-iso"><!-- HTML Form (wrapped in an isolated Bootstrap 3 div)
	
	
    <div class="container-fluid"> 
        <div class="row"> <!--Bootstrap -->
            <div class="col-md-8 col-sm-8 col-xs-10">
            
            <p>Glyphicon user: <span class="glyphicon glyphicon-user"></span></p>

            <p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p>
                   
            <p>exclamation icon: <span class="glyphicon glyphicon-exclamation-sign"></span></p>
            </div>
            </div>
  </body>
</html>

＆＃13;

Answer 1

首先，值得注意的是，由于我认为<div class="bootstrap-iso">旁边缺少结束评论，因此您注释了两个https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css元素。除此之外，您还要两次引用jQuery和Bootstrap ISO，但我认为这是为了让您的Snippet正常工作：）

至于你的实际问题，你只需要添加相关的CSS文件： <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> <link href="https://formden.com/static/assets/demos/bootstrap-iso/bootstrap-iso/bootstrap-iso.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="bootstrap-iso">  <div class="container-fluid"> <div class="row">  <div class="col-md-8 col-sm-8 col-xs-10"> <p>Glyphicon user: <span class="glyphicon glyphicon-user"></span></p> <p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p> <p>exclamation icon: <span class="glyphicon glyphicon-exclamation-sign"></span></p> </div> </div> </div> </div> </body>

这可以在下面看到，我还更正了评论和引用的文件：

＆＃13;

{{1}}

＆＃13;

在css文件中本地托管的Bootstrap-Iso未正确显示glyphicons。需要修复

1 个答案: