手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >css实现文字层浮在图片之上示例代码
css实现文字层浮在图片之上示例代码
摘要:代码如下:说明*{padding:0;margin:0;}.images-content{position:absolute;z-index...

css实现文字层浮在图片之上示例代码1

代码如下:

<!DOCTYPE html>

<html lang="zh-CN">

<head>

<meta charset="utf-8" />

<title>说明</title>

<meta name="keywords" content="关键词" />

<meta name="description" content="摘要" />

<link href="css/global.css" rel="stylesheet" type="text/css" />

<>

<style type="text/css">

*{

padding:0;

margin:0;

}

.images-content{

position: absolute;

z-index: 1;

left: 0;

bottom:0;

width: 100%;

color: #fff;

background: rgba(0,0,0,.7);

height: 54px;

line-height: 54px;

overflow: hidden;

}

.images-wrapper{

width:251px;

height:330px;

position:relative;

}

</style>

</head>

<body>

<div>

<img src="images/goods-1.jpg" alt="商品111" title="商品1"/>

<div>

1111111111

</div>

</div>

</body>

</html>

【css实现文字层浮在图片之上示例代码】相关文章:

CSS3正方体旋转示例代码

css按钮自适应实现原理及代码

CSS各种文字对齐方式代码

实现CSS3中的border-radius(边框圆角)示例代码

巧用CSS3 border实现图片遮罩效果代码

css实现文字层浮在图片之上示例代码

Visual C++中实现对图像数据的读取显示

CSS实现左图右文混排布局的方法

css实现文字的自动隐藏

用css实现十字的布局示例代码

精品推荐
分类导航