Ⅰ CSS涓鎬庝箞瀹氫綅鏄劇ず鍥劇墖涓鏌愪釜浣嶇疆
background: url("../images/news.jpg") no-repeat scroll 10px 10px;
涓婇潰鐨勬暟瀛楀氨鏄瀹氫綅錛岀涓涓鏁板瓧鐨勫乏鍙沖畾浣嶏紝絎浜屼釜鏄涓婁笅瀹氫綅鐨勶紝浣犵敤寮犲浘鐗囪瘯璇曚慨鏀規暟瀛楀氨鐭ラ亾錛屼篃灝辮兘鐞嗚В浜
Ⅱ 在html中如何把圖片放到所指定的位置
1、構思:一張大圖片、一張小圖片要形成什麼意境,要事先構思好。
Ⅲ html如何調整圖片位置
1、可以使用background-position屬性設置圖片位置,具體的方法是,首先用hbuilder軟體新建一個html文件,文件的head標簽中設置輸入style標簽:
Ⅳ 如何用css精確定位小圖片的位置
如何用css精確定位小圖片的位置
首先設置固定圖片的css屬性是background-attachment
background-attachment它有兩個屬性值fixed/scroll
background-attachment:fixed;表示固定圖片,圖片不隨著頁面滾動而滾動。
background-attachment:scroll;表示不固定圖片,圖片隨著頁面滾動而滾動
background-position這個屬性用來定點陣圖片的位置。
我們重點給大家分享background-position這個屬性
2background-position;的語法結構,用水平和垂直位置進行定位。
background-position:x y;
其中,x有三個值:left(左),center(中),right(右)。用來設置水平位置;
y也有三個值:top(上),center(中),bottom(下)。用來設置垂直位置;
兩個屬性值得中間一定要用英文的空格 ,隔開。
代碼如下:
<style type="text/css">
<!--
#img{
background-image:url("圖片存放路徑"); /*插入背景圖*/
background-repeat:no-repeat; /*設置圖片不重復*/
background-color:#00ffff; /*設置背景顏色*/
background-position:left center; /*用居中對齊設置水平距離,用下面對齊設置垂直距離*/
width:400px; height:150px; /*設置寬度 和高度*/
}
-->
</style>
<div id="img"></div>
3background-position:左邊距離 上邊距離。這個用來找圖片。
比如一張大圖上面有很多小圖,你只想用到其中一個小圖就用這個找。
代碼如下:
<html>
<head>
<style type="text/css">
#main{
{
background-image:url("圖片存放路徑"); /*插入背景圖*/
background-repeat:no-repeat; /*設置圖片不重復*/
background-color:#00ffff; /*設置背景顏色*/
background-position:60px 50px; /*設置水平距離和垂直距離*/
width:400px; height:200px;
}
</style>
</head>
<body>
<div id="main"></div>
</body>
</html>