手机
当前位置:查字典教程网 >网页设计 > 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实现文字层浮在图片之上示例代码】相关文章:

CSS各种文字对齐方式代码

通过css加载远程字体示例代码

css实现图片在div中居中的效果

css清除浮动方法和代码

css特效 一道闪光在图片上划过代码

css实现鼠标悬停时滑出层提示的方法

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

文字排版在网页制作中应遵守的原则

CSS实现段落首行缩进两个字符不再使用空格

CSS3 实用技巧:实现黑白图像效果示例代码

精品推荐
分类导航