<!doctype html>
<html lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#change').click(function(){
$('p').css({"border-color":"#62D781","background-color":"#EAF7EE"});
$('#error').attr("src","img/success.jpg")
});
$('#close').click(function(){
$('p').hide();
});
});
</script>
<style type="text/css">
p {
border-style: solid;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-color: #F5A0A0;
background-color: #FCEEEE;
width:540px;
height: 30px;
line-height: 30px
}
#close{
float: right;
margin-top: 7px
}
#error{
float: left;
margin-top: 7px
}
</style>
</head>

<body>
<p>dfsfsd<img src="img/info.jpg" id="error"><img src="img/close.jpg" id="close"></p>
<button id="change">change border</button>
</body>
</html>

完整代码(包括图片和js文件)，到我的Github下载:https://github.com/joyang1/ChangeBorderColor

css边跨实例的更多相关文章

  1. 【转】精选30个优秀的CSS技术和实例

    今天,我为大家收集精选了30个使用纯CSS完成的强大实践的优秀CSS技术和实例,您将在这里发现很多与众不同的技术,比如:图片集.阴影效果.可扩展按钮.菜单等-这些实例都是使用纯CSS和HTML实现的. ...

  2. 精选30个优秀的CSS技术和实例

    精选30个优秀的CSS技术和实例   投递人 墙头草 发布于 2008-12-06 20:57 评论(97) 有17487人阅读 原文链接 [收藏] « » 今天,我为大家收集精选了30个使用纯CSS ...

  3. css技术和实例

    今天,我为大家收集精选了30个使用纯CSS完成的强大实践的优秀CSS技术和实例,您将在这里发现很多与众不同的技术,比如:图片集.阴影效果.可扩展按钮.菜单等-这些实例都是使用纯CSS和HTML实现的. ...

  4. 30个优秀的CSS技术和实例 By 彬Go 2008-12-04

    在这里可发现很多与众不同的技术,比如:图片集.阴影效果.可扩展按钮.菜单等…这些实例都是使用纯CSS和HTML实现的.单击每个实例的标题可以被转向到该技术实例的相关教程或说明页面(英文),单击每个实例 ...

  5. SQL ser 跨实例访问数据库

    SqlServer如何跨实例访问数据库 Exec sp_droplinkedsrvlogin LinkName,NullExec sp_dropserver LinkName go EXEC sp_a ...

  6. CSS 分类 (Classification) 实例

    CSS 分类 (Classification) 实例CSS 分类属性 (Classification)CSS 分类属性允许你控制如何显示元素,设置图像显示于另一元素中的何处,相对于其正常位置来定位元素 ...

  7. CSS 尺寸 (Dimension) 实例

    CSS 尺寸 (Dimension) 实例CSS 尺寸属性CSS 尺寸属性允许你控制元素的高度和宽度.同样,还允许你增加行间距. 属性 描述height 设置元素的高度.line-height 设置行 ...

  8. CSS 边框(border)实例

    CSS 边框(border)实例:元素的边框 (border) 是围绕元素内容和内边距的一条或多条线. CSS border 属性允许你规定元素边框的样式.宽度和颜色. CSS 边框属性属性 描述bo ...

  9. CSS 字体(font)实例

    CSS 字体(font)实例CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母).CSS 字体系列在 CSS 中,有两种不同类型的字体系列名称: 通用字体系列 - 拥 ...

随机推荐

  1. Pythonb编码规范

    本编码规范是对知道创宇研发技能表中提供的PythonCodingRule.pdf文档进行凝练和总结出来的结果,感谢知道创宇的Geek精神与分享精神 此规范较为严格,严格规定了编码格式和命名规则,仅适于 ...

  2. 数据库：MySQL索引背后的数据结构及算法原理【转】

    原文:http://blog.codinglabs.org/articles/theory-of-mysql-index.html 摘要 本文以MySQL数据库为研究对象,讨论与数据库索引相关的一些话 ...

  3. [更新中]【South使用总结】django开发中使用South进行数据库迁移

    Django开发中使用South进行数据库迁移的使用总结 South的详细资料可产看官方文档http://south.readthedocs.org/en/latest South安装配置 pip i ...

  4. executeUpdate,executeQuery,executeBatch 的区别

    executeQuery : 用于实现单个结果集,例如: Select 一般使用executeQuery 就是来实现单个结果集的工具 executeUpdate 用于执行 INSERT.UPDATE ...

  5. POJ 2176 Folding（区间DP）

    题意:给你一个字符串,请把字符串压缩的尽量短,并且输出最短的方案. 例如:AAAAA可压缩为5(A), NEERCYESYESYESNEERCYESYESYES可压缩为2(NEERC3(YES)). ...

  6. strrpos()和strripos()函数【PHP】

    strripos() 函数 定义和用法 strripos() 函数查找字符串在另一个字符串中最后一次出现的位置. 如果成功,则返回位置,否则返回 false. 语法 strrpos(string,fi ...

  7. C++实现筛选法

    筛选法 介绍: 筛选法又称筛法,是求不超过自然数N(N>1)的所有质数的一种方法.据说是古希腊的埃拉托斯特尼(Eratosthenes,约公元前274-194年)发明的,又称埃拉托斯特尼筛子. ...

  8. windows VS2013 编译安装QWT6.1和QWTPolar1.1.1

    QWT的编译和配置 1. 下载QWT从官网 For getting a snapshot with all bugfixes for the latest 5.2 release: svn expor ...

  9. 51NOD 1616 最小集合

    传送门 分析 不难发现集合中的数一定是集合内其它一堆数的$gcd$ 于是我们枚举$i$,统计原来集合中有几个数是$i$的倍数,设这个值为$f(i)$ 之后对于每个$i$如果不存在$f(x*i) = f ...

  10. poj3171 Cleaning Shifts

    传送门 题目大意 有一个大区间和n个小区间,每个小区间都有一个代价,求最少付出多少代价可以使得小区间完全覆盖大区间. 分析为了方便起见我们先将s变为2,其它的位置都对应更改以便后期处理.我们考虑以t1 ...