JQuery--jQquery控制CSS样式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.main{
width: 100px;
height: 100px;
background-color: pink;
}
</style>
<script src="lib/jquery-1.12.2.js"></script>
<script>
$(function () {
/**
* [JQ的CSS函数]
* 单属性修改(可以忽略)
* .css(属性,值)
* 多属性修改（推荐）
* .css({
* 属性:值
* });
* 更是推荐
* .css({
* "属性":"值(单位)", -- 代码通俗易懂
* });
* 单属性获取
* .css(属性)
* */
$('button:eq(0)').click(function () {
$('.main').css({
"width":"200px"
});
}); $('button:eq(1)').click(function () {
$('.main').css({
"height":"200px"
});
}); $('button:eq(2)').click(function () {
$('.main').css({
"background-color":"blue"
});
}); $('button:eq(3)').click(function () {
$('.main').css({
"width":"300px",
"height":"300px",
"background-color":"#666"
});
}); $('button:eq(4)').click(function () {
alert($('.main').width()+"px");
});
});
</script>
</head>
<body>
<button>变宽</button>
<button>变高</button>
<button>变色</button>
<button>三变</button>
<button>获取宽度，并弹窗</button>
<div class="main">
文字行号
</div>
</body>
</html>
JQuery--jQquery控制CSS样式的更多相关文章
- jQuery控制CSS样式
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- JQuery中操作Css样式的方法
JQuery中操作Css样式的方法//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#tw ...
- 【转发】JQuery中操作Css样式的方法
JQuery中操作Css样式的方法 //1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#t ...
- JS 控制CSS样式表
JS控制CSS所使用的方法: <style> .rule{ display: none; } </style> 你想要改变把他的display属性由none改为inline. ...
- jQuery基础 - 改变CSS样式
jQuery提供css()的方法来实现嵌入式改变元素样式,css()方法在使用上具有多样性.其中一种接受两个输入参数:样式属性和样式值,它们之间用逗号分开.比如我们要改变链接颜色,我们可以使用下面的代 ...
- JQuery中操作Css样式
//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#two").attr(&qu ...
- jquery轻松操作CSS样式
$(this).click(function(){ if($(this).hasClass(“zxx_fri_on”)){ $(this).removeClass(“zxx_fri_on”); ...
- jquery 控制css样式
一.CSS 1.css(name) 访问第一个匹配元素的样式属性. 返回值 String 参数 name (String) : 要访问的属性名称 示例: $("p").css(&q ...
- zepto和jquery关于获取css样式的试用差别
例如 获取 html标签的 字体大小, zepto中方法:$("html").css( "font-size" ); jquery中方法:$("htm ...
- 用js语句控制css样式
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
随机推荐
- 如何使用log4j记录日志
1.下载jar包 http://logging.apache.org/log4j 2.将jar包加入项目 放在lib(没有就创建)下 对已经复制过来的jar包鼠标点击右键,选中BuildPath - ...
- (补充)10.Hibernate框架的查询方式
技术分析之Hibernate框架的查询方式 1. 唯一标识OID的检索方式 * session.get(对象.class,OID) 2. 对象的导航的方式 3. HQL的检索方式 * Hibernat ...
- Lombock原理
说道Lombok,可能会鲜为人知.但是在实际的开发中,它起到了很大的作用,话不多说,直入正题: 一.Lombok是什么 现在看一下Lombok官方对其进行的解释:Lombok官网:https://pr ...
- JDK中有关23个经典设计模式的示例
Creational patterns Abstract factory (recognizeable by creational methods returning an abstract/inte ...
- light oj 1068 数位dp
#include <stdio.h> #include <string.h> #include <stdlib.h> #include <math.h> ...
- ArcSDE 10.0与ArcSDE10.1的又一个区别
ArcSDE10.0 安装后直接在创建sde表空间和sde用户的时候创建了sde服务:而sde10.1可以直接先通过ArcMap10.1直连数据库,创建sde表空间.sde用户.然后在有必要的情况下再 ...
- PAT甲级——A1050 String Subtraction
Given two strings S1 and S2, S=S1−S2 is defined to be the remaining string after taking ...
- Django模型中的OneToOneField和ForeignKey有什么区别？
说是ForeignKey是one-to-many的,并举了一个车的例子: 有两个配件表,一个是车轮表,另一个是引擎表.两个表都有一个car字段,表示该配件对应的车. 对于车轮来说,多个对应一个car的 ...
- Python学习之--数字转人民币读法（解决问题的方法很重要）
效果图: 实现代码: money = float(input("Please input the money:"))cop = int(money)Num = ['零','壹',' ...
- mysql中not in子查询不能为空
转载自:https://blog.csdn.net/headingalong/article/details/77744755 错误sql delete from company_info where ...