簡體   English   中英

Bootstrap在簡單的HTML頁面上不起作用

[英]Bootstrap not working on simple html page

我有以下html標記,當前僅顯示帶有某些樣式的簡單文本“ HELLO STACKOVERFLOW”。 標記取自插圖畫家,我正在嘗試合並自舉程序以使頁面更具響應性。 我不知道為什么文本不會隨瀏覽器大小而改變。 它似乎是固定的。 瀏覽器顯示引導腳本正在運行,但是我無法弄清什么是覆蓋引導。 代碼中的樣式只是文本大小和顏色。

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=1190,height=792" />
    <title>5707.CC2014.R30TEST2-1</title>
    <link href="css/idGeneratedStyles.css" rel="stylesheet" type="text/css" />
    <script src="script/idGeneratedScript.js" type="text/javascript"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous" />
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
</head>
<body id="x5707.CC2014.R30TEST2-1" onload="RegisterInteractiveHandlers();" lang="en-GB" xml:lang="en-GB" style="width:1190px;height:792px">
    <div class="container">
        <div class="row">
            <div class="col-lg-6" style="width:13883.54px;height:2339.22px;position:absolute;top:0px;left:0px;-webkit-transform-origin: 0% 0%; -webkit-transform: translate(0px,45.2px) rotate(0deg) scale(0.05);transform-origin: 0% 0%; transform: translate(0px,45.2px) rotate(0deg) scale(0.05);">
                <p class="Basic-Paragraph ParaOverride-1"><span id="_idTextSpan000" class="CharOverride-1" style="position:absolute;top:-470.32px;left:0px;letter-spacing:15.4px;">HELLO STACKOVERFLOW</span></p>
            </div>
        </div>
    </div>
</body>
</html>

有關級聯特異性,請參見規則。

Bootstrap樣式表使用.col-lg-6設置的大小的特異性為0010而Illustrator的style 屬性設置的大小的特異性為1000

style屬性是更具體的,因此它會覆蓋CSS,而不是相反。

這兩個評論是正確的。 您是從生成器(如上所述的Illustrator,盡管樣式表為InDesign樣式表)獲得此代碼的。 生成器通常會添加內聯樣式。 這也是這里發生的事情。 只需從您的body元素中刪除所有style="[css-rules]"屬性,它就會起作用。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM