如何使背景不環繞段落標簽

Question

對於我的新網站，我試圖讓背景保持作為背景，並使段落標簽獨立存在。 我不希望背景制作不同的矩形，里面有背景，我希望背景是一個整體。 這是 HTML：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=decice-width, initial-scale=1.0" />
        <link href="https://fonts.googleapis.com/css?family=Kulim+Park&display=swap" rel="stylesheet">
        <title>zippernet</title>
        <style>
            body {
                background: rgb(2,0,36);
background: linear-gradient(10deg, rgba(2,0,36,1) 0%, rgba(80,80,255,1) 100%, rgba(0,212,255,1) 100%);
            }
            p, h1, h2, h3, h4, h5, h6 {
                font-family: 'Kulim Park', sans-serif; 
                color: white;
            }
            .rotated-heading {
                font-size: 50px;
                float: right;
            }
        </style>
    </head>
    <body>
        <p class="rotated-heading">Welcome to zippernet!</p>
    </body>
</html>

這是網站網址： https : //zippernet.000webhostapp.com/index.html

Answer 1

我將您的問題解釋為您希望漸變覆蓋瀏覽器窗口的整個寬度和高度。 如果這是正確的，以下 CSS 應該可以幫助您解決問題。

html {
  height: 100%;
}
body {
  height: 100%;
  background: rgb(2,0,36);
  background: linear-gradient(10deg, rgba(2,0,36,1) 0%, rgba(80,80,255,1) 100%, rgba(0,212,255,1) 100%);
  background-repeat: no-repeat;
  background-size: cover;
}
p, h1, h2, h3, h4, h5, h6 {
    font-family: 'Kulim Park', sans-serif;
    color: white;
}
.rotated-heading {
    font-size: 50px;
    float: right;
}

如何使背景不環繞段落標簽

問題描述

1 個解決方案

解決方案1
0 已采納 2020-01-03 20:55:45

如何使背景不環繞段落標簽

問題描述

1 個解決方案

解決方案1 0 已采納 2020-01-03 20:55:45

解決方案1
0 已采納 2020-01-03 20:55:45