整个⽹页都设置成灰⾊,素⾊(css样式) 以下是效果图,最后⾯p o了源代码!
<style type="text/css">
/*把整个⽹页都设置成灰⾊,素⾊*/
/*
html {
-webkit-filter: grayscale(100%);
filter: progid:DXImageTransform.Microsoft.BasicImage(graysale=1);
}
*/
.allGray {
-webkit-filter: grayscale(100%);
filter: progid:DXImageTransform.Microsoft.BasicImage(graysale=1);
}
</style>
整个页⾯都变为灰⾊、素⾊了
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"> <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>整个⽹页都设置成灰⾊,素⾊</title>
<link rel="stylesheet" type="text/css" href="${tPath}/css/body.css">
<link rel="stylesheet" type="text/css" href="${tPath}/css/mark.css">
<link rel="stylesheet" type="text/css" href="${tPath}/css/console.css">
<script type="text/javascript" src="${tPath}/js/console.js"></script>
<script type="text/javascript" src="${tPath}/js/loading.js"></script>
<script type="text/javascript" src="${tPath}/js/toTop.js"></script>
<script type="text/javascript" src="${tPath}/js/weChatQRCode.js"></script>
<script type="text/javascript" src="${tPath}/My97DatePicker/WdatePicker.js"></script> <script type="text/javascript" src="${tPath}/js/test.js"></script>
<script type="text/javascript" src="${tPath}/js/testVar.js"></script>
<script type="text/javascript" src="${tPath}/js/xml.js"></script>
<script type="text/javascript" src="${tPath}/fig.js"></script>
<script type="text/javascript" src="${tPath}/ueditor/ueditor.all.min.js"></script>
<script type="text/javascript" src="${tPath}/ueditor/lang/zh-cn/zh-cn.js"></script>
<style type="text/css">
body {
padding: 0;
margin: 0;
}
input[type=text], input[type=password], input[type=file] {
height: 38px;
}
/*把整个⽹页都设置成灰⾊,素⾊*/
/*
html {
-webkit-filter: grayscale(100%);
filter: progid:DXImageTransform.Microsoft.BasicImage(graysale=1);
}
*/
.allGray {
-webkit-filter: grayscale(100%);
box sizingfilter: progid:DXImageTransform.Microsoft.BasicImage(graysale=1);
}
.editor {
/* border: 2px solid #8E388E; */
border: 3px solid blue;
border-radius: 6px; /*把边框做成圆⾓*/
/
*color: red;*/
}
*{
/*不把边框,padding(内边距)计算进去*/
/*
box-sizing:border-box; 是CSS3新增属性,了解这个属性,我们先从块级元素的盒⼦⼤⼩说起,通常⼀个块级元素实际所占宽⾼度=外边距(margin)+ 边界宽度(border-width) + 内边距(padding)+ ⾼度(height) / 宽度(width)如果设置了border-box,实际所占宽⾼度 = 设置的⾼度(height)/ 设置的宽度(width)+ 外边距(margin)
*/
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.myHrTag {
height:5px;
border:5px solid black;
}
.myHrTag2 {
height:5px;
border:5px solid #CD0000;
}
</style>
</head>
<body>
<center id="myCenter">
<h1>整个⽹页都设置成灰⾊,素⾊</h1>
<a href="www.jb51/article/34863.htm" target="_blank">
getComputedStyle与currentStyle获取外部样式(style/class)
</a>
<h3>
<span >
获取外部样式兼容写法:
</span>
var finalStyle = 元素对象.currentStyle ? 元素对象.currentStyle
: ComputedStyle(元素对象, null);
</h3>
<h2>百度的ueditor富⽂本编辑器js报错(console控制台可以看到报错信息),导致回到顶部功能不能正常使⽤</h2> <input id="setAllGrayButton" type="button" value="点击我,把整个⽹页置为灰⾊" onclick="setAllGray(this)">
<br><br>
<form id="testForm" action="" method="get">
<h2>企业信息</h2>
企业名称:<input type="text" value="于都县雪豹软件⼯作室"><br><br>
企业性质:
<select>
<option id="1">民企(有限责任公司)</option>
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论