/*在p之后插入我是好人*/ p.first:after { content: "好人" } /*在p之前插入亲爱的朋友men*/ p:before { content: "亲爱的朋友men" } /*设置第一个p元素*/ p:first-child{ /*background-color: yellow;*/ } /*设置最后一个p元素 等价于:p:nth-last-child(1)*/ p:last-child{ /*background-color: yell

思路:点击当前li元素后是用removeClass()删除所有兄弟元素(使用siblings()获取)的class样式,然后使用addClass()为当前li添加class. 具体演示如下: 1.HTML结构:设计三个li元素 <ul id="test"> <li>Glen</li> <li>Tane</li> <li>John</li> </ul> 2.css样式:设计一个类selecte

CSS是层叠式样式表,主要用来控制页面的样式. 一.CSS概述 应用CSS: 1.外部样式表,CSS写在一个单独的.CSS文件中,在head里加<link rel="stylesheet" tpye="text/css" href="路径及名称"> 2.内部样式表,写在html的head的style标签中 3.内联样式表,直接写具体标签上,<h1 style="color #FFF">ddd</h

一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body100%宽度 行级标签 常见的行级标签:a,span,strong,u,em 1.能和其他元素待在同一行2.不能设置宽高3.宽高 是内容的宽高 行内块标签 常见的行内块标签:img,input,textarea1.能和其他元素待在一行2.能设置宽高 span默认是不能设置宽高的,但是设置了displ

CSS视觉格式化模型(visual formatting model)是用来处理文档并将它显示在视觉媒体上的机制.这是CSS 2.1的一个基础概念.视觉格式化模型根据CSS盒模型为文档的每个元素生成0,1或多个盒.每个盒的布局由如下内容组成: 盒尺寸:明确指定,受限或没有指定 盒类型:块级盒(block-level box),行内级别盒(inline-level box),行内盒(inline-box),原子行内级别盒(atomic inline-level box) 定位方案(position

伪类和伪元素 有时候,你需要选择本身没有标签,但是仍然易于识别的网页部位,比如段落首行或鼠标滑过的连接.CSS为他们提供一些选择器:伪类和伪元素. 常用的一些伪类选择器: :link :visited :hover :active 表示普通的链接(没访问过的链接) 表示访问过的链接 浏览器是通过历史记录来判断一个链接是否访问过, *由于涉及到用户的隐私问题,所以使用visited伪类只能设置字体的颜色 表示鼠标移入的状态 超链接被点击的状态 <!DOCTYPE html> <html&g

first-child 选中第一个标签 应用CSS样式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" conte

本教程案例在线演示 有路网PC端 有路网移动端 教程配套源码资源 教程配套源码资源 div div 可定义文档中的分区(division). div 标签可以把网页分割为独立的.不同的部分. 可以看成以下结构: div不像 h1,p标签,没有任何默认样式,其主要作用是标识网页上的某块区域.常见做法是通过给div元素加上id或class,然后通过css选中某个div,对其进行样式美化. <div class="demo">我是一个div</div> <sty

js//获取文件标题 document.body //body document.title //网页标题 document.doctype//文档对象 document.url//路径 //服务器相关 //align document.domain//域名 //---操作文本节点--- //获取父节点 var arrayObj = document.getElementsByTagName('div'); for(var i = 0 in arrayObj){ alert(arrayObj[i

一.scrapy框架的使用 前面我们讲了pyspider 它可以快速的完成爬虫的编写 不过pyspider也有一些缺点 例如可配置化不高 异常处理能力有限对于一些反爬虫程度非常强的网站 爬取显得力不从心 1. scrapy框架介绍 scrapy是一个基于Twisted 的异步处理框架 是纯python实现的爬虫框架 架构清晰 模块之间耦合度低 可拓展性极强可以灵活完成各种需求 只需要定制开发几个模块 就可以轻松实现一个爬虫 1.1 架构介绍 可以分为如下几个部分 Engine 引擎 处理整个系统

最近研究echarts,发现提示框太大,位置不合适问题, 用jq,css选中div的tooltip设置大小有时候不管用: 查了官网文档 http://echarts.baidu.com/option.html#tooltip.extraCssText 最后解决了 tooltip: { trigger: 'item', formatter: "{a} <br/>{b}: {c} ({d}%)", position:function(p){ //其中p为当前鼠标的位置 retu

研究半天还跟正常套路不一样,WKWebView 需要将 JS 注入进去,套路啊 ... 查半天资料,为了后者们开发可以提高效率,特此分享一下,不到的地方多多包涵哈. 废话不多说,直接上 code,将如下 code 直接 copy 进 WKWebView 控件实例化的地方即可. //禁止长按弹出 UIMenuController 相关 //禁止选择 css 配置相关 NSString*css = @"body{-webkit-user-select:none;-webkit-user-drag:n

 你想要的sublime.webstorm.vi/vim不得不用的快捷键[简报][实用] 话不多说,马上走起: Sublime Text: ctrl+d  alt+f3全选 ctrl+shift+’ (鼠标右键)多行编辑  可单个添加   先选中多行 Ctrl+Shift+L  行尾编辑 ctrl+shift+a 父容器选中 ctrl+shift+m js.css选中括号 ctrl+shift+↑ 或 ↓ ctrl+shift+d 复制选中 或复制行 ctrl+[ 或 ] 缩进 ctrl+x 剪

HTML部分 <!DOCTYPE html> <html lang="en"> <head> <!--head标签的主要作用:文档的头部主要描述了文档的各种属性和信息, 包括文档的标题.编码方式以及URL等信息, 这些信息大部分是用于提供索引的,辨认和识别其他方面的应用(移动端)--> <meta charset="UTF-8" http-equiv="refresh" content=&qu

16-如何正确的使用类选择器及总结 一般情况下尽量不要去使用id选择器,因为id选择器有很大的限制性,id一般都是JS配合使用的,类选择器都是和CSS配合使用的,特殊性情况可以用id选择器. 类的使用想要用好首先要找共有的属性 一定要有“公共类”的概念,不要试图用一个类去写所有的属性,标签要携带多个类,共同设置标签的样式,每个类要尽可能的小,最好只有一个样式 17-高级选择器   名称 说明 并集选择器 多个选择器通过逗号连接而成,同时声明多个风格相同样式 交集选择器 由两个选择器连接而成,选中

1.上午讲昨天的作业. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>作业</title> <style type="text/css"> /* 选中父级ID 选中父级下面的所有span标签 */ #html span { /* 文本 */ color: #FFC0CB; background-color: r

1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.getElementsByClassName("class名"); 3.通过元素标签去获取元素 document.getElementsByTagName("标签名"); 4.通过css选择器去获取元素 document.querySelectorAll("cs

零.sublime的优势 容易上手 支持多点编辑 包管理:Package Control 速度快 深度可订制,配置文件放github上 sublime-config 快速文件切换 cmd + p 输入文件名 cmd + shift + p 打开命令面板 启用vim模式 学的是习惯技巧,sublime死了,技巧习惯可配置到其他编辑器 社区活跃 一.安装 以下操作均是在Mac环境下操作的. 1.1 下载安装 Mac下的安装,官网:http://www.sublimetext.com brew cas

  在一幅图表中,文本.坐标轴和图像的是信息传递的核心,对着三者的设置是作图这最为关心的内容,在上一篇博客中虽然列举了一些设置方法,但没有进行深入介绍,本文以围绕如何对文本和坐标轴进行设置展开(对图像的设置在后续介绍到各种图绘制时介绍). 这里所说的文本是指在使用matplotlib作图过程中通过代码的方式往图中添加的各种文字,包括figure标题.axes标题.坐标轴标签.坐标轴刻度标签.注释.普通文本等.轴设置指的是对与坐标轴相关的的元素的设置,例如显示范围.刻度.刻度标签等. In [1]

本篇小随笔,记录下侧边栏的写法和ng-click点击选中事件.因为这个工程不让引用jQuery.所以ng-click选中事件用了一个比较笨的方法实现的. 下面是HTML页面 按 Ctrl+C 复制代码 按 Ctrl+C 复制代码 css部分引入了angular里面的bootstrap,它和bootstrap官网里面的还是有点区别的,可以直接去angularjs官网下载. 还有就是自己写的css样式.同时引入了angular.min.js.因为工程还需要使用嵌套路由的方式,所以引入了ui-rout

打开一个页面,选中一段文字,会出现系统默认的蓝色背景和白色文字,如下图: 那么 这种选中效果我们怎么去自定制呢,比如我想让文字选中的时候背景是绿色,文字是白色 我们在css文件中插入如下代码: ::-moz-selection { background: #26a69a; color: #ffffff; } ::selection { background: #26a69a; color: #ffffff; } 再看一下效果: 这时候有些同学可能就开始想象了,是不是font-size,font-