Question

我正在使用Dreamweaver CC（请不要诋毁这个程序的使用）并且整天都在使用我的.css文件。当我打开bootstrap.css文件时，我选择了“make writeable”（我意识到这是你应该避免的）然后我的视图几乎立即变为空白。

当我删除自定义.css文件的链接时，会出现文本，但是一旦我将HTML链接到.css文件，视图就会变为空白。此文件似乎对其他HTML页面具有相同的效果，使我相信.css文件是问题。

这是我的代码，请帮我找到最新消息：

@charset "utf-8";
h1, h3, h2, p {
    text-align: center;
    z-index: 2;
}
#main {
    width: 75%;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 60px;
    margin-bottom: 60px;
}
.navbar, .navbar-default {
    border-width: 0px;
    background-color: #FFFFFF;
    margin-top: 20px;
}
footer {
    margin-top: 60px;
    padding-top: 25px;
    padding-bottom: 25px;
    background-color: #383838;
    color: #F5F5F5;
    text-align: center;
}
.image-fill {
    width: 100%;
}
#wrapper {
    padding-left: 0px;
    padding-right: 0px;
}
#floating {
    background: rgba(255, 255, 255, 0.5);
    color: #000000;
    z-index: 1;
    overflow-x: visible;
    float: none;
    top: 0pt;
    position: absolute;
    left: 62px;
    margin-left: 100px;
    width: 400px;
    margin-top: 99px;
}

body{
    text-align: center;
}

.test-center {
    display: inline-block;
}

/* Stable */
.instructions {
    background-color: rgba(0,0,0,0.50);
    position: fixed;
    z-index: 92;
    height: auto;
    width: 50%;
    border: medium solid rgba(7,255,35,1.00);
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
    padding-top: 10px;
    border-radius: 25px;
    display: none;
}

.instruction-text {
    color: rgba(7,255,35,1.00);
    position: relative;
    top: auto;
    font-family: immi-five-o-five;
    font-style: normal;
    font-weight: 400;
    font-size: 28px;
}

.instruction-text-header {
    color: rgba(7,255,35,1.00);
    font-weight: 400;
    font-family: immi-five-o-five;
    font-size: 50px;
}


/* Mutable */

.instructions-min {
    padding-bottom: 0px;
    padding-top: 0px;
    border-radius: 0px;
    border-top: medium solid rgba(7,255,35,1.00);
    border-bottom: hidden;
    border-left: hidden;
    border-right: hidden;
}

.smallfont {
    font-size: 25px;
}

.test-center {
    display: inline-block;
}

.instruction-loc-big {
    width: auto;
    height: auto;
}

.instruction-loc-mini {
    top: 92%;
    left: 0%;
    bottom: 0%;
    width: 100%;
}

html的

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
    <link href="styles.css" rel="stylesheet" type="text/css">
    <link href="bootstrap.css" rel="stylesheet" type="text/css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
    <script src="testing.js"></script>
    <script>var __adobewebfontsappname__="dreamweaver"</script><script src="http://use.edgefonts.net/caesar-dressing:n4:default;lobster-two:n4:default;chicle:n4:default;henny-penny:n4:default;immi-five-o-five:n4:default.js" type="text/javascript"></script>
</head>

<body class="center">
    <div class="container-fluid" id="wrapper">
      <div class="container-fluid instructions instruction-loc-big">
        <h1 class="instruction-text-header">How It Works</h1>
        <div class="minimizable">
          <h3 class="instruction-text">1. Sign Up/Sign In </h3>
          <h3 class="instruction-text">2. Click a flyer </h3>
          <h3 class="instruction-text">3. Get your ticket </h3>
          <h3 class="instruction-text">4. Forward your ticket order confirmation</h3>
        </div>
      </div>
    </div>
</body>
</html>

Answer 1

在第69行检查您的CSS文件，并将.instructions设置为display:none。

所以你的所有内容都被隐藏了。

Dreamweaver CC：CSS文件导致白屏

1 个答案: