前端一HTML:十七:背景
生活随笔
收集整理的這篇文章主要介紹了
前端一HTML:十七:背景
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
??background-color: 背景顏色
?
? background-image: 背景圖片(默認(rèn)是平鋪圖片)
?
??background-repeat: 是否平鋪
?
??background-position: 背景圖片的位置
? ? ? ? ? ? ? ?1. 取值--方位名詞: ?top上, bottom下, left左, right右, center中 ?background-position: right bottom
? ? ? ? ? ? ? ?2. 設(shè)置像素. ?background-position: 300px, 50px;?
? ? ? ??
?
<!doctype html> <html lang="en"> <head><meta charset="UTF-8"><title>Document</title><style>div{height: 600px;width: 800px;background-color: pink;background-image: url(html/google.jpg);background-repeat: no-repeat;background-position: right bottom; /*方位名詞設(shè)置位置*//*background: url(html/google.jpg);*/}</style> </head> <body><!-- div 默認(rèn)的寬度是占一整行 --><div> </div> </body> </html>背景屬性的連寫方式?
<!doctype html> <html lang="en"> <head><meta charset="UTF-8"><title>Document</title><style>div{height: 600px;width: 800px;/*背景屬性的連寫方式,按照如下順序 background-color, background-image, background-repeat, background-position */background: pink url(html/google.jpg) no-repeat 200px 200px;}</style> </head> <body><!-- div 默認(rèn)的寬度是占一整行 --><div> </div> </body> </html>?
總結(jié)
以上是生活随笔為你收集整理的前端一HTML:十七:背景的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： springmvc一:编写简单的Hell
- 下一篇： 前端一HTML:十八:元素的显示方式