首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

css中类与元素

效果可以通过添加一个实际类来达到,而元素效果则需要通过添加一个实际元素才能达到,这也是为什么他们一个称为类,一个称为元素原因。...种类 元素种类 区别 这里用类 :first-child 和元素 :first-letter 来进行比较。...p>i:first-child {color: red} first second i标签第一个元素,也就是first,颜色会变红。... 总结 元素和类之所以这么容易混淆,是因为他们效果类似而且写法相仿,但实际上 css3 为了区分两者,已经明确规定了类用一个冒号来表示,而元素则用两个冒号来表示。...:Pseudo-classes::Pseudo-elements 但因为兼容性问题,所以现在大部分还是统一单冒号,但是抛开兼容性问题,我们在书写时应该尽可能养成好习惯,区分两者。

2.4K80

为网站开启Nginx缓存加速,支持html静态页面

在我测试期间发现,Nginx 缓存也同样可以缓存静态 html 页面,完全可以替代 WP-Super-Cache 这类缓存插件了。.../test.html 就可以清除该 URL 缓存(我实际测试经常是 404...)。...二、本地模式 第一种代理模式,我们是利用本地转发变相实现反向代理下 Nginx 缓存功能,并且可以缓存 html 静态页面。从整体配置可以看出,已经非常接近百度云加速等 CDN 缓存功能了!...测试中发现,这种模式貌似无法缓存 html 静态页面,稍有遗憾,有兴趣童鞋可以深入研究看看,可能是我没测试到位。...三、惯例总结 好了,通过以上折腾,我们已经完美的解决了 Nginx 实时生成缩略图带来 CPU 开销问题了!而且,从代理模式缓存中,我们甚至可以缓存 html 静态页面,这意味着什么?

4K90

CSS中类和元素

定义 类 CSS 类 是添加到选择器关键字,指定要选择元素特殊状态。 例如,:hover 可被用于在用户将鼠标悬停在按钮上时改变按钮颜色。...元素 元素是一个附加至选择器末关键词,允许你对被选择元素特定部分修改样式。 下例中 ::first-line 元素可改变段落首行文字样式。 /* 每一个 元素第一行。...区别 下面是一个简单html列表片段: 我是第一个 我是第二个 如果想要给第一项添加样式,可以在为第一个 添加一个类,并在该类中定义对应样式...li:first-child { color: orange } 下面是另一个简单html段落片段: Hello World, and wish you have a good day!...因此,类与元素区别在于:有没有创建一个文档树之外元素。

2.7K10

Nginx开启fastcgi_cache缓存加速,支持html静态页面

不会朋友可以参考前文: 为网站开启 Nginx 缓存加速,支持 html 静态页面 Ps:需要重新编译 Nginx,在原有的编译参数上新增一个 ngx_cache_purge 模块,比如: -...二、Nginx 配置 要用这个缓存功能,建议重新弄一个 server 模块(替换之前),如下代码是张戈博客目前正在使用规则(已删除了我自定义静态规则,避免混淆视听): #############...静态页面 By 张戈博客 #     文章地址:http://zhangge.net/5042.html ‎ #     参 考 ①:http://jybb.me/nginx-wordpress-fastcgi_cache-purge...(之前你新增静态规则可以添加到这,没有就不用了)                 try_files $uri $uri/ /index.php?...HIT 表示缓存命中 打开一个会缓存页面,比如文章内容 html 页面,F5 刷新几次即可在 F12 开发者模式当中 Header 头部信息中看到如图缓存命中状态: ?

3.3K50

总结类和元素(转)

如下例,除了第一个元素外,其他元素文本都会变为橙色。 HTML: ? CSS: ? 2 :first-child 匹配元素第一个子元素。...如下例,第一个元素文本会变为橙色。 HTML: ? CSS: ? 3 : last-child 匹配元素最后一个子元素。 如下例,最后一个元素文本会变为橙色。 HTML: ?...4 first-of-type 匹配属于其父元素首个特定类型子元素每个元素。 如下例,第一个元素和第一个元素文本会变为橙色。 HTML: ? CSS: ?...5 :last-of-type 匹配元素最后一个子元素。 如下例,最后一个元素文本会变为橙色。 HTML: ? CSS: ?...如下例,第一个ul元素只有一个li类型元素,该li元素文本会变为橙色。 HTML: ? CSS: ?

1.4K20

CSS类与元素

https://github.com/WindrunnerMax/EveryDay CSS引入类和元素概念是为了格式化文档树以外信息。...也就是说,类和元素是用来修饰不在文档树中部分,比如,一句话中第一个字母,或者是列表中第一个元素。...类用于当已有元素处于某个状态时,为其添加对应样式,这个状态是根据用户行为而动态变化。比如说,当用户悬停在指定元素时,我们可以通过:hover来描述这个元素状态。...虽然它和普通css类相似,可以为已有的元素添加样式,但是它只有处于dom树无法描述状态下才能为元素添加样式,所以将其称为类。 状态性类 是基于元素当前状态进行选择。...实际上,元素就是选取某些元素前面或后面这种普通选择器无法完成工作。控制内容和元素是相同,但它本身是基于元素抽象,并不存在于文档结构中。

1.9K20

我可能学到了“假”CSS:元素

CSS选择器除了根据id、class、属性等从DOM中获取元素以外,还有很重要一类,用来获取元素特别内容或特别状态,这就是 元素(Pseudo-elements) 和 类(Pseudo-classes...) [I] 元素 元素是对元素中特定内容进行操作,选取诸如元素内容第一个字(母)、第一行,选取某些内容前面或后面这种普通选择器无法完成工作。...它控制内容实际上和元素是相同,但是它本身只是基于元素抽象,并不存在于文档中,所以叫元素 ::before 在元素内容之前插入额外生成内容 ::after 在元素内容之后插入额外生成内容 ::...[1.1] ::before 和 ::after 相比于其他元素大都是对文档中已有部分选择,::before 和 ::after 则是向文档树中加入内容,这些内容并不存在于HTML源代码中,但确是可见...正确理解样式权重 同样以上例HTML结构说明,因为 ::first-letter 是元素,相当于 ::first-letter 选择“第”字成为了 span 子元素,故其权重大于span样式权重

1.4K10

共享

2.2.9 共享 2.2.9.1什么是共享 计算机系统中为了解决主内存与CPU运行速度差距,在CPU与主内存之间添加了一级或者多级高速缓冲存储器(Cache),这个Cache一般是集成到CPU内部...当多个线程同时修改一个缓存行里面的多个变量时候,由于同时只能有一个线程操作缓存行,所以相比每个变量放到一个缓存行性能会有所下降,这就是共享。 ?...更坏情况下如果cpu只有一级缓存,那么会导致频繁直接访问主内存。 2.2.9.2为何会出现共享 共享产生是因为多个变量被放入了一个缓存行,并且多个线程同时去写入缓存行中不同变量。...2.2.9.3如何避免共享 JDK8之前一般都是通过字节填充方式来避免,也就是创建一个变量时候使用填充字段填充该变量所在缓存行,这样就避免了多个变量存在同一个缓存行,如下代码: public...,以及如何避免,并证明多线程下访问同一个cache行多个变量时候才会出现共享,当单个线程访问一个cache行里面的多个变量时候反而对程序运行起到加速作用。

62230

【前端就业课 第一阶段】HTML5 零基础到实战(四)类与元素

/category_11609526.html 一、什么是类 1.1 类基础使用 小媛:这一节咱们讲啥?...1_bit:这一节咱们先讲类。 小媛:什么是类? 1_bit:这个知识点有点抽象,类指给当前整个 html 代码已经存在元素(标签)模拟添加一个类样式来实现一种效果。...1_bit:这是写法,例如“标签:类”,代码中 first-child 指的是第一个元素,标签如果是 p 那意思就是 p 第一个元素,后面的 first-child 就是“指给当前整个 html...1_bit:对元素和理解概念类似,元素就是指模拟一个元素来实现某种效果。例如先看一个简单示例,咱们在一句话中,需要给开头第一个字标红,这个时候常规写法如下。...【前端就业课 第一阶段】HTML5 零基础到实战(六)表格详解 【前端就业课 第一阶段】HTML5 零基础到实战(五)基础元素 【前端就业课 第一阶段】HTML5 零基础到实战(四)类与元素

44330

a

DOCTYPE html> <meta name="viewport" content="width...-- 1.通过我们<em>的</em>观察发现a标签存在一定<em>的</em>状态 1.1默认状态, 从未被访问过 1.2被访问过<em>的</em>状态 1.3鼠标长按状态 1.4鼠标悬停在a标签上状态 2.什么是a标签<em>的</em><em>伪</em>类选择器?...a标签<em>的</em><em>伪</em>类选择器是专门用来修改a标签不同状态<em>的</em>样式<em>的</em> 3.格式 :link 修改从未被访问过状态下<em>的</em>样式 :visited 修改被访问过<em>的</em>状态下<em>的</em>样式 :hover 修改鼠标悬停在a标签上状态下<em>的</em>样式...:active 修改鼠标长按状态下<em>的</em>样式 4.注意点 4.1a标签<em>的</em><em>伪</em>类选择器可以单独出现也可以一起出现 4.2a标签<em>的</em><em>伪</em>类选择器如果一起出现, 那么有严格<em>的</em>顺序要求 编写<em>的</em>顺序必须要个<em>的</em>遵守爱恨原则...://www.jd.com">jd

71720

CSS3类和元素特性和区别

其实上面提到这些类和元素都是CSS1和CSS2中概念,CSS1和CSS2中对元素区别比较模糊,甚至经常有同行将:before、:after称为类。...类由一个冒号:开头,冒号后面是名称和包含在圆括号中可选参数。 任何常规选择器可以再任何位置使用类。类语法不区别大小写。一些作用会互斥,另外一些类可以同时被同一个元素使用。...简单翻译一下: 元素在DOM树中创建了一些抽象元素,这些抽象元素是不存在于文档语言里(可以理解为html源码)。...一个选择器只能使用一个元素,并且元素必须处于选择器语句最后。 注:不排除未来会加入同时使用多个元素机制。 同样,第一段话是元素清晰定义,也是元素与类最大区别。...最后,总结一下类与元素特性及其区别: 类本质上是为了弥补常规CSS选择器不足,以便获取到更多信息; 元素本质上是创建了一个有内容虚拟容器; CSS3中类和元素语法不同; 可以同时使用多个

98590
领券