Js脚本之jQuery学习笔记(2)

CSS简介

Html 4.0之后推出css,采用div布局。使用css来实现页面的外观。

CSS使用三种方式给页面或页面元素应用样式

  • 类,修饰页面中特定区域
  • 标签,将页面中的XHTML标签重定义
  • 高级

CSS规则

选择符 {属性:值}

  • 选择符:css样式所针对的对象
  • 属性:包括颜色、大小、定位、浮动和位置等
  • 值:属性与值为一组,组之间用(;)隔开

如:

h1 {font-family:"Microsoft sans serif 黑体"}#left-column h3 , .subMenu h3 , .title{padding:5px; height:22px;font-size:16px;background:url(../img/bg-header.gif) no-repeat left top;}

CSS引入方式

  • 内联样式表

    
    
    <h1 style="color:#fff;font-size=11px">标题</h1>
  • 内部样式表(不能跨页执行)
  • <head><style type="text/css">body {background:url(images/bg-gif) repeat-y;margin:0px;padding:0px;}#content {float:left;width: 479px;}</style></head>
  • 连接外部样式表(独立文件XX.css)
    <link rel="stylesheet"  type="text/css" href="style.css" />

    接下来将学习css应用的到某个特定元素的方法(选择器),框模型,元素定位与布局,然后CSS这块就学完了。

PS:哈哈,hexo的markdown是支持css的,上面这段红字就是用内置css生成的。。

时间: 2024-10-13 16:04:41

Js脚本之jQuery学习笔记(2)的相关文章

Js脚本之jQuery学习笔记(1)

Js脚本之jQuery学习笔记(1) 一.javascript基础 单行注释 多行注释 /* */ 数据类型 数值型 字符串型 布尔型 空值 未定义值 转义字符 函数定义:1234567891011121314<head><script language="javascript"function test(m){var xixi="嘻嘻"alert("这是javascript")document.write(xixi + m)}

Js脚本之jQuery学习笔记(4)

CSS之框模型和定位篇 框模型 在排版Html的时候,除了对元素的显示外观进行美化,还会涉及到页面元素的布局,于是引入了框的概念, 即我们对HTML里面的元素排版以一个个框为基本单位. 元素div与span的异同 首先我们先来了解两个元素 div:属于对内容分组使用的元素,没有任何预定语义的通用元素 span:属于文本元素,没有任何预定语义的通用元素 通俗的来说,没有预定义即不同与 代表段落.代表超链接已经有了自己含义.这两个元素的区别在于,使用div修饰时,它有一个区域的概念,会另起一行,与上

锋利的JQuery 学习笔记

第一章 认识JQuery ·页面加载事件(可以写多个ready())$(document).ready(function(){alert(“hello world”);}) ·链式操作:JQuery允许你在一句代码中操做任何与其相关联的元素,包括其子元素.父元素等//选择名称为myDiv的元素,为其自身添加css1的样式,然后再选择其所有子元素a,为其移除css2样式$(“#myDiv”).addClass(“css1″).children(“a”).removeClass(“css2″); ·

jQuery学习笔记10:Ajax技术

jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据. jQuery 采用了三层封装:最底层的封装方法为:$.ajax(),而通过这层封装了第二层有三种方法:.load().$.get()和$.post(),最高层是$.getScript()和$.getJSON()方法. 函数 描述 jQuery.ajax() 执行异步 HTTP (Ajax) 请求. .ajaxComplete() 当 Ajax 请求完成时注册要调用的处理程序.这是一个

JQuery学习笔记(1)

JQuery学习笔记(1) 认识JQuery 简介 JQuery是一个JavaScript库,语法简洁,有跨平台的兼容性,简化了开发人员遍历html文档.操作dom.处理事件.执行动画和开发Ajax的操作.理念是:写得少,做得多. 优点 1.轻量级.UglifyJS压缩后大小保持在30KB 2.选择器强大. 3.DOM操作封装. 4.可靠地事件处理机制. 5.完善的Ajax. 库类型 jquery.js(开发版) 约229kb,用于学习和开发. jquery.min.js(生产版) 约31kb,

jQuery学习笔记——jQuery基础核心

代码风格 在jQuery程序中,不管是页面元素的选择.内置的功能函数,都是美元符号“$”来起始的.而这个“$”就是jQuery当中最重要且独有的对象:jQuery对象,所以我们在页面元素选择或执行功能函数的时候可以这么写: $(function () {}); //执行一个匿名函数 $(‘#box’);//进行执行的ID元素选择 $(‘#box’).css(‘color’, ‘red’);//执行功能函数由于$本身就是jQuery对象的缩写形式,那么也就是说上面的三段代码也可以写成如下形式:jQ

jQuery学习笔记——jQuery常规选择器

一.简单选择器在使用 jQuery 选择器时,我们首先必须使用“$()”函数来包装我们的 CSS 规则.而CSS 规则作为参数传递到 jQuery 对象内部后,再返回包含页面中对应元素的 jQuery 对象.随后,我们就可以对这个获取到的 DOM 节点进行行为操作了.#box {//使用 ID 选择器的 CSS 规则color:red;//将 ID 为 box 的元素字体颜色变红}在 jQuery 选择器里,我们使用如下的方式获取同样的结果:$('#box').css('color', 'red

jQuery学习笔记(一):入门

jQuery学习笔记(一):入门 一.JQuery是什么 JQuery是什么?始终是萦绕在我心中的一个问题: 借鉴网上同学们的总结,可以从以下几个方面观察. 不使用JQuery时获取DOM文本的操作如下: 1 document.getElementById('info').value = 'Hello World!'; 使用JQuery时获取DOM文本操作如下: 1 $('#info').val('Hello World!'); 嗯,可以看出,使用JQuery的优势之一是可以使代码更加简练,使开

jQuery学习笔记--JqGrid相关操作 方法列表(上)

1.获得当前列表行数:$("#gridid").getGridParam("reccount"); 2.获取选中行数据(json):$("#gridid").jqGrid('getRowData', id); 3.刷新列表:$(refreshSelector).jqGrid('setGridParam', { url: ''), postData: ''}).trigger('reloadGrid'); 4.选中行:$("#jqGrid