css简单学习属性2---背景图片

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
       div{
           background-image: url("图片1.png"),url("图片2.jpg");
           /*图片1在x轴重复，图片2不重复*/
           background-repeat: repeat-x,no-repeat;
           background-position: 100%,100%,center,center;
           /*盒子大小*/
           width: 100px;
           height: 800px;
       }
    </style>
</head>
<body>
<div>
</div>
</body>
</html>

效果图

时间： 2024-11-10 12:20:05

css简单学习属性2---背景图片的相关文章

CSS再学习之背景色背景图片

背景色 p {background-color: gray;} 如果您希望背景色从元素中的文本向外少有延伸,只需增加一些内边距. p {background-color: gray; padding: 20px;} 背景图片 body {background-image: url( xxx.jpg );} 背景重复. background-repeat: repeat-y; 背景定位. background-position:center; 百分数值. background-position:5

css简单学习属性

1:内联元素和块级元素 1).块级元素,默认是独自占据一行的.比如是<p>.<h1>.<h2>.<h3>.<h4>.<h5>.<h6>.<ul>.<ol>.<dl>.<pre>.<hr />2).内联元素,默认是几个内联元素都可以在同一行上显示.比如是<a>.<span>等.2:内联元素可以变成块级元素,块级元素可以变成内联元素. &l

css简单学习属性3---css属性选择器

1 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> [id*=div] { color: lime; } /*^首字符*/ [id^=div] { color: darkblue; } /*$结束字符*/ [id$=ym] { color: crim

css实现永远居中的背景图片

<title>css实现永远居中的背景图片丨</title> <STYLE TYPE="text/css">  </STYLE> <br

CSS之生成全屏背景图片

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>CSS之生成全屏背景图片</title> <link rel="stylesheet" href="http://files.cnblogs.com/files/caidupingblogs/backgroundima

CSS制作斜角上有背景图片的Div层

<html> <head> <title>CSS制作斜角上有背景图片的Div层</title> <style> .window{ width:400px; border:1px solid #B6B6C0; position:relative; } .title{ background:#F0F0F2; height:30px; border-bottom:1px solid #CBCFD2; font-size:14px; line-heigh

【CSS学习笔记】背景图片

直接看代码: background: blue; /*页面背景为蓝色,很简单的代码*/background-image:url(small.jpg); /*页面背景是名字叫small.jpg的图片*/background-repeat: no-repeat; /*水平方向显示图片repeat-x 竖直方向显示图片repeat-y 不重复图片no-repeat*/ background-attachment: fixed; /*在页面特别长有滚动条时,可以固定图片*/ 相关知识点: 1.背景图与背

jQuery获取和设置disabled属性、背景图片路径

之前对于这个独特的disabled属性获取和设置很混乱,今天项目中用到了,用attr不能实现,于是多次试验得出: 获取disabled属性用prop $("#basic_key").prop("disabled") 以上会返回true或false. 然后设置disabled是attr,重点是后面的一个参数不加引号: $("#basic_key").attr("disabled",'false') //false加引号是错误的~

利用jquer+css简单实现购物网站的图片增大。

在我们浏览淘宝京东等网站的时候,浏览商品的图片时,当我们把鼠标移动到图片上的时候,会让其变大,利于消费者观察,接下来我将用jQuery+css技术对其功能进行一简单实现. 第一步:创建项目,并且在webapp下建立如下文件夹. 第二步:代码编译: HTML+CSS: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here<