<!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. 2015广州强网杯(Misc)

    单身狗: 下载图片 被一只狗挡住了的二维码,用图片处理软件把上面两个正方形随便一个覆盖狗的地方 我直接用美图秀秀处理一下,扫一下就得到flag

  2. [Apache]如何查看apache服务器的error log（错误日志）

    在进行网页和服务器的测试时, 有时会提醒 500 Internal Server Error: The server encountered an internal error or misconfi ...

  3. 简单叙述一下MYSQL的优化

    一个面试题.每次没能完全答对.各位补充一下.或者发表自己的答案:cry: 现在大概列出如下:(忘各位补充)1.数据库的设计尽量把数据库设计的更小的占磁盘空间.1).尽可能使用更小的整数类型.(medi ...

  4. 2015.3.5 VS2005调用VC6 dll 时结构参数的传递

    结构只能以地址方式进行传递,dll只能传递结构不能传递类 VS端: [DllImport(@"D:\程序\VC程序\MfcDllspace\Debug\space.dll")] p ...

  5. Linux常用的编辑保存退出命令

    Vi Vim进入编辑后退出 按ESC后 1.保存退出 :wq :x 最快捷的方法:直接按shift+zz,或者切换到大写模式按ZZ,就可以保存退出了,即是按2下大写的Z.区别::wq 强制性写入文件并 ...

  6. Runtime机制的使用整理

    一.基本概念 1.1.RunTime简称运行时,就是系统在运行的时候的一些机制,其中最主要的是消息机制. 1.2.对于C语言,函数的调用在编译的时候会决定调用哪个函数,编译完成之后直接顺序执行,无任何 ...

  7. springmvc 初始化参数绑定(使用属性编辑器) 来处理类型转换问题

    处理一种日期格式 处理器中的写法: index.jsp中的写法: 处理多种日期格式: 处理器的写法: 自定义的属性编辑器: index.jsp的写法:

  8. cfree使用cygwin编译程序出现计算机丢失cygwin1.dll解决办法

    这种情况多是环境没配好,我的是64位cygwin C:\cygwin64\bin 加入到环境变量中,重打开cfree就可以解决.

  9. queue队列模块

    import Queue myqueue = Queue.Queue(maxsize = 10) Queue.Queue类即是一个队列的同步实现.队列长度可为无限或者有限.可通过Queue的构造函数的 ...

  10. [patl2-020]功夫传人

    解题关键:dfs的简单应用,需要注意类型double与int #include<cstdio> #include<cstring> #include<algorithm& ...