Kannadi na samar da: saukar raba ƙwalla na ƙasa

Kannadi na samar da saukar raba ƙwalla na ƙasa da ke amfani da CSS.

Saukar raba ƙwalla na ƙasa

Kannadi na samar da saukar raba ƙwalla da ke kaiwa saukar raba ƙwalla na ƙasa (da yar ƙasa) na yiwuwa: saukar raba ƙwalla da ke kaiwa saukar raba ƙwalla na ƙasa (da yar ƙasa) na yiwuwa:

Watsi - saukar raba ƙwalla da ke kaiwa ƙwalla ƙusa

Watsi - saukar raba ƙwalla da ke kaiwa yar ƙwalla

Kannadi na samar da saukar raba ƙwalla da ke kaiwa ƙwalla ƙusa

Amfani da wuri na ƙarƙaƙa, kuma ake sanya saukar raba ƙwalla da ke 100% ga wuri ɗin ƙarƙaƙa.

Tuntubar:Ayyana 50% zai iya samar da saukar raba ƙwalla da ke kaiwa yar ƙwalla. Dukansu amfani da属性 na background a kaiwa saukar raba ƙwalla da ke tsaki kuma yakin kaiwa:

Kiyaye:Lakawo a karewa da yadda ake samar da saukar raba ƙwalla da ke kaiwa 100% ga ake kaiwa saukar raba ƙwalla da ke tsaki kuma yakin kaiwa: height: 100% sabonan a yi amfani da <html> da <body>:

Tsaki raba ƙwalla na ƙasa:

body, html {
  height: 100%;
}
.bg {
  /* Takamai na gani a yi gudanar */
  background-image: url("dancer.jpg");
  /* Tsaki ƙwalla */
  height: 100%;
  /* Ziyada ajiyawa da a hanyar tsaki kuma yakin kaiwa ta hanyar */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

亲自试一试

半页背景图像：

.bg {
    height: 50%;
}

亲自试一试