jquery 内边框设置

最新推荐文章于 2022-01-06 18:24:04 发布
最新推荐文章于 2022-01-06 18:24:04 发布
阅读量2.6k 收藏
点赞数
分类专栏： 前端开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ruizhengyun/article/details/45063195
版权 


<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jquery 内边框设置</title>
<style type="text/css">
	*{margin:0;padding:0;list-style-type:none;}
	a,img{border:0;}
	img{max-width:100%; width:auto\9; height:auto; vertical-align:middle; border:0; -ms-interpolation-mode:bicubic;}
	body{ font-family:"Microsoft yahei",arial; font-size: 14px; text-align: center;}
	.wrapper{width: 1000px; margin:50px auto; text-align:left;}
	ul{ margin:0; padding:0; list-style: none;}
	.clearfix:before,.clearfix:after{ display:table; content:'';}
	.clearfix:after{overflow: hidden; clear: both;}
	.clearfix{zoom:1;}
	.clear{clear: both;}
	.imgBox li{ width:160px; float: left; margin:0 15px 15px 0; padding:5px;}
	.imgBox li .img a{ display: block;}
	.imgBox li .img img {width: 160px; height: 160px;}
	.imgBox li .name{height: 30px; line-height: 30px; text-align: center;}
	.imgBox li .name a{color: #333; text-decoration: none;}
	.imgBox li .name a:hover{color:green; text-decoration: none;}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
<script type="text/javascript">
// 插件
;(function($) {
	// 定义名称
	$.fn.borderAnimate = function(options){
		// 设置默认参数
		var defaults = {
			animated: 'easeOutElastic',		// 动画名称
			speed: 1500,						// 延迟时间
			borderClass: 'imgBd', 			// 边框的样式
			borderWidth: 5,					// 边框的宽度与长度
			borderStyle: 'dashed',			//边框的形式
			borderColor: 'orange',			// 边框的颜色
			zIndex:1
		};
		// 可自定义参数设置
		var options = $.extend({},defaults,options);
		return this.each(function(i){
			var _this = $(this);
			// 判断边框html时候存在
最低0.47元/天 解锁文章
编程之上
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
html+在ul中加边框,为元素添加边框，你有多少种好办法？
weixin_39603476的博客
05-31 2970
本文作者：IMWeb 莫卓颖未经同意，禁止转载背景相信大家在做项目的过程中会经常遇到这样的一个需求，鼠标hover到某个元素的时候为这个元素添加边框，这个简单的需求仅需注意添加边框后不会对原有的位置造成布局的影响从而造成布局跳动。本文将会试图探讨完成这个简单需求的方法。方案一实现思路：为元素中预先设置边框，边框的颜色与元素所在父元素背景色一致，边框大小与hover时候的边框大小一致，鼠标hover...
JS - 立即执行函数
都随它大小便吧
09-03 362
立即执行函数是立即执行，且执行一次，执行后销毁的函数。其作用是创建一个局部作用域，避免变量污染全局作用域。
jQuery获取元素宽高（内边距、边框和外边距）
weijia_kmy的博客
12-22 1万+
返回元素的宽、高。 width() height() 返回元素的宽、高（包括内边距）。 innerWidth() innerHeight() 返回元素的宽度（包括内边距和边框）。 outerWidth() outerHeight() 返回元素的宽度（包括内边距、边框和外边距） outerWidth(true) outerHeight(true)<!doctype html> <html
jQuery给所有的元素加边框
走在秃头的路上的博客
03-20 4032
$('*').css("border","aqua 2px dashed");
jquery实现模态框
anmi8562的博客
07-12 1462
需求： 1、点击添加弹出模态框； 2、点击编辑弹出模态框，并有默认值； 3、点击删除，删除此行数据。 <!-- jquery模态框 --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <...
jQuery边框渐变显示特效特效代码
03-20
jQuery边框渐变显示特效是一种常见的网页交互设计技术，它能为网站增添视觉吸引力，提升用户体验。这个特效是通过使用jQuery库以及一个名为jquery.insetborder的插件来实现的。下面将详细介绍jQuery、边框样式和如何...
jquery图片边框阴影浮动特效代码
03-20
【标题】：“jQuery图片边框阴影浮动特效代码” 在网页设计中，为了提升用户体验和视觉效果，经常需要为图片添加动态边框和阴影效果。"jQuery图片边框阴影浮动特效代码"是一个专为此目的设计的JavaScript库，它利用...
jQuery圆角边框网页分页插件.zip
最新发布
09-26
本资源“jQuery圆角边框网页分页插件.zip”提供了一个实用的jQuery插件，用于在网页中实现具有圆角边框的分页效果。这个插件可以帮助开发者快速创建美观且易于使用的网页分页组件，提升用户体验。 首先，我们需要...
jQuery内置进度条按钮特效代码
03-20
1. **HTML结构**：创建一个基础的HTML按钮元素，例如`<button>`，并为其设置相应的ID或类名，以便于在jQuery中选中和操作。 2. **CSS样式**：编写CSS代码定义按钮的初始样式，包括尺寸、边框、背景色等。此外，还...
jquery椭圆边框下拉菜单.zip
11-22
由于边框无法直接设置为椭圆形，我们可以通过设置不同的水平和垂直边框半径来模拟椭圆效果。例如，`border-radius: 50% 50%`将创建一个圆形，而`border-radius: 50% 25%`则会产生椭圆形状。同时，我们还需要调整元素...
jQuery基础------图片加边框
jerker___的博客
09-16 951
通过jQuery，点击图片，给图片添加边框 点击图片前 点击图片后 代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="../jQuery.js"></script> </head> <body> &l
js边框设置
feicongcong的博客
04-19 1万+
style="border: 1px solid #e2e2e4;border-radius:10px;height: auto;" js边框设置 border: 1px solid #e2e2e4;  边框 border-radius:10px;  圆边角
jquery设置css样式、style属性 示例
u013521540的博客
12-01 3831
[size=medium]css虽然会在一开始我们就定义好了，但是有很多场景需要我们动态设置css，或者单独修改一个dom控件的style属性，今天分享一下我总结的jquery设置css及style样式的方法。 一、CSS 1、css(name) 访问第一个匹配元素的样式属性。 返回值 String 参数 name (String) : 要访问的属性名称 示例： $(...
通过jQuery更改css样式中边框颜色
m0_46680765的博客
07-08 2988
拿底部边框举例： (".layui−this").css("border−bottom−color","red");误区：1、(".layui-this").css("border-bottom-color","red"); 误区： 1、(".layui−this").css("border−bottom−color","red");误区：1、(".layui-this").css(“border-bottom”,“red 1px solid”); 2、$(".layui-this").css(“borde
用 jquery 改变li的右边框颜色
痞子杨
09-21 2612
$(‘li’).css({‘border-right’:’1px’,’border-color’,’#f00’});
jquery 修改input边框和背景颜色
li836779537的博客
01-06 3047
代码： <input id="aaa" name="bbb" class="ccc" "/> 这里的 $(".ccc")也可以换 $("#aaa") ，哪种方式都可以。 if($(".ccc").val() == 0){ $(".ccc").css("border-color","red");//边框颜色 $(".ccc").css("background-color","#FCF2AD");//背景颜色 } 效果图： ...
前端开发面试题集锦（一）
热门推荐
江湖再见
06-30 2万+
你如何理解HTML结构的语意化? 1、去掉或样式丢失的时候能让页面呈现清晰的结构； 2.屏幕阅读器（如果访客有视障）会完全根据你的标记来“读”你的网页； 3.PDA、手机等设备可能无法像普通电脑的浏览器一样来渲染网页（通常是因为这些设备对 CSS的支持较弱）； 4.搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重； 5.你的页面是否对爬虫容易理解非常重要,因为爬虫很大程度上会忽
jquery 拖动 div 边框
08-06
其中，jquery提供了拖动(div)边框的功能，可以通过以下步骤实现： 1. 首先，在HTML文件中创建一个div元素，设置一个唯一的id，用来标识该div。例如： ```HTML <div id="myDiv"></div> ``` 2. 在JavaScript代码中...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值