Heim >Web-Frontend >CSS-Tutorial >So legen Sie Hintergrundeigenschaften in CSS fest (ausführliche Erklärung)

So legen Sie Hintergrundeigenschaften in CSS fest (ausführliche Erklärung)

青灯夜游
青灯夜游nach vorne
2018-10-12 18:01:013143Durchsuche

Dieser Artikel gibt Ihnen eine detaillierte Erklärung zum Festlegen von Hintergrundattributen in CSS. Ich hoffe, dass er für Freunde hilfreich ist.

Zu den hintergrundbezogenen Attributen gehören hauptsächlich:

  • Hintergrundfarbe Hintergrundfarbe

  • Hintergrundbild Hintergrundbild

  • background-repeat Ob die Kachel wiederholt werden soll (Standardkachel) | >

  • Hintergrundpositionslänge (Prozentsatz) |. Im Allgemeinen werden die beiden zusammen verwendet. Wenn eine Richtung angegeben ist und die andere Richtung standardmäßig auf Mitte eingestellt ist, können die beiden Methoden verwendet werden auch gemischt und aufeinander abgestimmt sein. Bei Positionssubstantiven gibt es keine Reihenfolgenunterscheidung, aber bei der Verwendung von Prozentsätzen gibt es immer eine Reihenfolge, zuerst horizontal und dann vertikal
  • background-attachment Der Hintergrund ist fest bzw. scroll scroll fixiert
  • Hintergrund: Hintergrundfarbe, Hintergrundbild, ob kachelbar, fester oder scrollender Hintergrund, Hintergrundposition
  •   #p1 {
                width: 300px;
                height: 300px;
                background-color: blue;            /*默认是transparent透明的*/
                /* background-color: transparent; */
                background-image: url(Images/2.jpg);
                background-repeat: no-repeat;            /*不平铺,默认是水平垂直平铺*/
                /* background-repeat: repeat-y; */
                /* background-repeat:  repeat-x; */
                /* background-position: right bottom; */
                background-position: 10% center;
                background-attachment: fixed;
            }
  • Wenn der Hintergrund halb sein soll -transparent, verwenden Sie rgba(r, g b,a) als Mittel zur Angabe der Transparenz
p {
            width: 100%;
            height: 300px;
            background-color: rgba(0, 0, 0, 0.6);
        }

Wenn Sie mehrere Hintergrundbilder verwenden möchten, verwenden Sie „Hintergrund“, um mehrere URLs anzugeben. Kommas zum Trennen der einzelnen Gruppen. Wenn sich die Bilder überschneiden, wird das vorherige überschrieben. Die allgemeine Hintergrundfarbe muss jedoch nach der letzten URL angegeben werden.

p {
            width: 100%;
            height: 300px;
            background: url(Images/2.jpg) no-repeat left top, url(Images/3.jpg) no-repeat right bottom blue;
        }

Zusammenfassung: Das Obige ist der gesamte Inhalt dieses Artikels, ich hoffe, dass er für das Studium aller hilfreich sein wird. Weitere verwandte Tutorials finden Sie unter CSS-Grundlagen-Video-Tutorial

, CSS3-Video-Tutorial !

Das obige ist der detaillierte Inhalt vonSo legen Sie Hintergrundeigenschaften in CSS fest (ausführliche Erklärung). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:cnblogs.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen