Ⅰ 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>