问题缘起 在闲看别人网站时发现了这样的代码 <span class="hamburger icon" data-icon="C"> .icon:before { content: attr(data-memory); display:block; } 感觉很新鲜,content的用法以前见过,但是content和attr连用还是头回见.于是去查阅了一些资料. 解释一下content和attr() 在CSS2.1中attr()已经被定义,它表示总是返回一个

content 和 attr 配合使用 如果你不想把content内容在CSS里写死,那你可以使用attr表达式来从页面元素中动态的获取内容: /* <div data-line="1"></div> */ div[data-line]:after { content: attr(data-line); /* 属性名称上不要加引号! */ } attr属性通常和自定义属性data-配合使用,因为传统的其它属性虽然也能存值,但通常不适合存放表达性文字. conte

content 的attr 实现 鼠标悬浮 显示 悬浮提示, content 属性与 :before 及 :after 伪元素配合使用,来插入生成内容. 方法/步骤 1 <div> <span data-tooltip="hello world">Hover Me!!!</span> </div> 2 css如下 body{ padding: 100px; } span{ position: relative; display: inli

前言 本文讲解CSS中使用频率并不高的content属性,通过多个实用的案例,带你由浅入深的掌握content的用法,让代码变得更加简洁.高效. 定义 W3school中这样定义: content 属性与 :before 及 :after 伪元素配合使用,来插入生成内容. 该属性用于定义元素之前或之后放置的生成内容.默认地,这往往是行内内容,不过该内容创建的框类型可以用属性 display 控制. 在前端日常开发中,content属性使用频率并不高,所以开发者一般对它的理解并不深入,通常会在清除

1.content有5种属性 a.content:“”                     //为空 b.content:attr(TItle)     //可以获取当前选中标签的属性值 eg: div:after{content:attr(class)}   结果:lang c. content:"大浪"               //页面显示字符 d.content:'\2140'               //显示字符集图标 e.content:url(123.gif)

需求: (1)实现手风琴面板控件,支持静态HTML与JSON方式创建控件 (2)支持远程加载数据 (3)支持面板激活.远程加载事件注册 (4)支持动态添加.删除项目 实现图例 客户代码 <div> <div style="padding-left:100px; padding-bottom:12px; float:left"> <div id="accordionContainer" style="width:300px;he

在园友的强烈呼唤下,我还是负责任的分享给大家,因为对代码比较熟悉一下,还是有些问题要说明,不然别人看起来会比较费劲.说实话除了这个bootstrap的界面风格和这件事情本身对大家有吸引力之外,内部的逻辑,结构,可能有些捉襟见肘,会让大家见笑,大牛们完全可以略过.现在源码已经让我推到GitHub上面去了.我先从头到尾的介绍一下,然后说一些存在的问题.也希望大家给出更好的建议. 一.结构说明 1.MVC 我先说模型,共有20几张表,支持数据迁移.BaseInfos(基本资料),DetailInfos

1. :first-line 向元素的首行文本添加样式,不必关心首行是元素节点还是文本节点 <style> body,htm,div,p{ margin:0; padding:0; } div{ width:100px; height:100x; background-color:#FC9; } p{ height:50px; text-align:center; line-height:50px; } div > p:first-child{ background-color:#F90

一.CoreText的简介 CoreText是用于处理文字和字体的底层技术.它直接和Core Graphics(又被称为Quartz)打交道.Quartz是一个2D图形渲染引擎,能够处理OSX和iOS中图形显示问题.Quartz能够直接处理字体(font)和字形(glyphs),将文字渲染到界面上,它是基础库中唯一能够处理字形的模块.因此CoreText为了排版,需要将显示的文字内容.位置.字体.字形直接传递给Quartz.与其他UI组件相比,由于CoreText直接和Quartz来交互,所以它

Query是一个兼容多浏览器的javascript库,核心理念是write less,do more(写得更少,做得更多),对javascript进行了封装,是的更加便捷的开发,并且在兼容性方面十分优秀. http://www.php100.com/manual/jquery/  选择器与筛选器系列 模态框 a{ text-decoration: none; color: #428bca; } .modal-backdrop{ position: fixed; top:0; right:0; b

我利用网上特效开发的Jquery插件 代码如下 (function($){ $.fn.Dialogx = function(options) { var defaults={ Width:"300", Height:"300", Title:"对话框", Opacity:"0.2", Url:"", Content:"" }; var opts = $.extend({},default

对节点的操作 查找节点 查找节点可以直接利用jQuery选择器来完成,非常便利. 插入节点 jQuery提供了8种插入节点的方法. 序号 方法 描述 实例 1 append() 向每个匹配的元素内部追加内容. HTML Code: <p>我想说:</p> jQuery Code: $("p").append("<b>你好</b>"); result: <p>我想说:"<b>你好<

tip提示组件 常见的应用场景中,总是难免会遇到提示信息,比如显示不完全时需要鼠标移上去显示title,比如验证时的错误提示,比如操作按钮的辅助说明等,所以我独立出来了一个小的js组件,tip提示组件.效果如下图所示: 大概就是这样了,不复杂的东西,也很实用. 它的DEMO实例请点击这里http://lovewebgames.com/jsmodule/tip.html 它的源码托管在github 请点击这里https://github.com/tianxiangbing/tip <table s

搭建go开发环境:http://studygolang.com/articles/5406 日志相关:https://github.com/hpcloud/tail go定时器:http://studygolang.com/articles/1881 go文档:http://www.360doc.com/content/15/0918/08/7362_499866824.shtml go反射调用,xml处理:http://studygolang.com/articles/337 环境搭建:htt

先看bootstrap.popover.js的结构 var Popover = function ( element, options ){} //构造器 Popover.prototype = {} // 构造器的原型 $.fn.popover = function ( option ){} //jQuery原型上的自定义方法 $.fn.popover.Constructor = Popover //重写jQuery原型方法popover的构造器名 $.fn.popover.defaults

话不多说,直接上源代码 一.tool.js 封装一些共用方法,以及相关的浏览器兼容细节,供Base.js调用 //浏览器检测,一旦加载即执行 (function() { window.sys = {}; var ua = navigator.userAgent.toLowerCase(); var s; (s = ua.match(/msie ([\d.]+)/)) ? sys.ie = s[]: (s = ua.match(/firefox\/([\d.]+)/)) ? sys.firefox

不多说,贴出相关代码. 参数实体: package token.def; import java.io.Serializable; import java.util.Properties; public class TLoginParams implements Serializable { private static final long serialVersionUID = 6120319409538285515L; private String saltUin; private Stri

注意:每周有那么几次,此列表会更新一些新的窍门,最终,本文会成为超级有用的资源.//zxx:丑话说在前头,我可没功夫更新,所以,即使到您女儿出嫁那天,本文还是28项内容 前端的发展如此之迅猛,一不留神,大侠你可能就会被远远地甩在后面了.如果你不想被HTML5的改变/更新搅得不知所措的话,可以把本文的内容作为必须了解的热身课程. 一.新的Doctype //zxx:”doctype”中文意思指“文档类型” 仍在使用麻烦的,不可能记得住的XHTML文档类型? <!DOCTYPE html PUBLI

不多说,同样贴出相关代码 参数实体: package token.def; import java.io.Serializable; import java.util.Properties; public class TLoginParams implements Serializable { private static final long serialVersionUID = 6120319409538285515L; private String saltUin; private Str

之前做学校软件协会APP的时候,由于自己不会在服务端写接口,所以服务端一直是由另一位Z同学完成的,但是突然Z同学被老师调到泸州帮以前的学长做一个月的临时web开发去了,所以协会APP的接口只做了一部分就没了.我也很是无奈啊,想自己边学边做,但是时间不允许,马上就要做毕业设计了,而且还要帮老师写教材.但自己的需求其实还算比较简单,只需要在已做好的网站上获取信息即可,而且之前就知道有网络爬虫这种东西(虽然自己没实现过),所以我想在网上找一找相关的资料,于是便在网上找到了一款HTML解析器,也就是js