原生js实现将任意图片转换成rgb形式的纯css代码
代码语言:html
所属分类:其他
代码描述:原生js实现将任意图片转换成rgb形式的纯css代码,任意图片转换成rgb多行代码。
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Vexel</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<style></style>
<style>
html {
height: 100%
}
body {
margin: 0;
padding: 0;
height: 100%;
font-family: sans-serif;
}
header {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 4.5em;
background: -webkit-linear-gradient(#666, #333);
background: -moz-linear-gradient(#666, #333);
background: linear-gradient(#666, #333);
}
h1 {
display: inline-block;
color: #F1F1F1;
text-shadow: 0 1px #FFF, 0 -1px #000;
margin: 15px;
}
h3 {
display: inline-block;
color: #F3F3F3;
}
h1, h3 {
font-weight: normal;
}
#wrapper {
height: 100%;
box-sizing: border-box;
-moz-box-sizing: border-box;
padding-top: 4.5em;
}
#input {
background-color: #fff;
background-image: -webkit-linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%),
-webkit-linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%);
background-image: -moz-linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%),
-moz-linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%);
background-image: linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%),
linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%);
.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0