Dreamweaver CC：CSS 文件导致白屏

Question

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

当我将 link 删除到我的自定义 .css 文件时，文本出现，但是一旦我 link 将 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

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

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

Dreamweaver CC：CSS 文件导致白屏

Dreamweaver CC: CSS file causes white screen

html

css

dreamweaver

twitter-bootstrap