关于css 属性选择器的解析

下面为大家带来一篇全面了解css 属性选择器。内容挺不错的,现在就分享给大家,也给大家做个参考。

1.[class~=”flower”]:选中有flower的class 

class="flower ss"  class="ss flower"

2.[class|=’top’]:选择以top为top开头的class需要有’—’相连 或者单独的top

 class="top-ss"  class="top"  class="top-ss"//选不中

3.[class^=”top”]: 选中以top为开头的不管有没有特殊符号相连,单独的top也可以

class="top-ss"  class="topss"

4.[class$=”top”]: 选中以top为结束的class,单独的top也行

立即学习“前端免费学习笔记(深入)”;

 class="mytop"  class="my-top"  class="top"

5.[class*=’tt’]: 选中有tt两个字母的class不管其位置在哪里

 class="sttd"  class="ttee"  class="eett"

6.[target=_blank]

a标签中有target =_blank的选中

7.input[type=”button”]

以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注PHP中文网!

相关推荐:

关于CSS3定位和浮动的解析

关于CSS3中currentColor关键字的使用方法

以上就是关于css 属性选择器的解析的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1610395.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月24日 01:25:30
下一篇 2025年12月24日 01:25:35

相关推荐

  • 如何使用CSS实现鼠标悬浮出现遮罩层

    这篇文章给大家分享了两个鼠标悬浮出现说明遮罩层的效果,大家可以根据自己的需要选择某一种效果,两种效果文中都给出了实例代码,下面来一起看看吧。 先来一个简单的实现方法: Document .mask-wrapper { position: relative; overflow: hidden; } .…

    好文分享 2025年12月24日
    000
  • 关于CSS如何实现多行多列布局的方法

    这篇文章主要介绍了css实现多行多列的布局的实例代码,需要的朋友可以参考下 1.两列多行:   HTML: box1:实现两列多行布局 111 222 333 CSS: 立即学习“前端免费学习笔记(深入)”; .box1 { width: 500px; background: #EEEEEE;}.b…

    2025年12月24日 好文分享
    000
  • 关于CSS中animation属性的使用方法

    这篇文章主要介绍了css的animation属性使用实例讲解,是css入门学习中的基础知识,需要的朋友可以参考下 一、animation的语法1、@keyframes——插入关键帧(1)FormTo形式: @keyframes demo { from { Properties:Properties …

    2025年12月24日
    000
  • CSS使用position:sticky 实现粘性布局的方法

    这篇文章主要介绍了css使用position:sticky 实现粘性布局的方法的相关资料,内容挺不错的,现在分享给大家,也给大家做个参考。 简介 一般都知道下面几个常用的: {position: static;position: relative;position: absolute;positio…

    2025年12月24日 好文分享
    000
  • 关于CSS的display:inline-block属性的使用

    这篇文章主要介绍了css的display:inline-block属性的使用,其中对使用时产生的空隙问题的解决作了重点讲解,需要的朋友可以参考下 display:inline-block感觉与display:table-cell有些相似,例如对内部元素的包裹性。但是,由于display:inline…

    2025年12月24日 好文分享
    000
  • 关于CSS3的animation实现逐帧动画效果

    这篇文章主要介绍了css3 animation实现逐帧动画效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 css3里面的animation属性非常强大,但是自己用的比较少,最近有次面试就刚好被问到了,趁现在有时间就对animation做一个小总结。同时实现一个逐帧动画的demo作为练习 an…

    2025年12月24日 好文分享
    000
  • 如何利用CSS实现标题文字过长部分显示省略号

    这篇文章主要介绍了css实现标题文字过长部分显示省略号的方法,并且讲解了针对单行文字溢出和多行文字溢出的情况,需要的朋友可以参考下 前段时间在公司移动站的重构,遇到了一个产品列表title的需求是只显示两行,然后超过两行的字符用省略号显示。如下图的效果,当时第一感觉是这个需求只能通过后台输出的时候截…

    好文分享 2025年12月24日
    000
  • 关于不同浏览器下的CSS中Hack的兼容性

    这篇文章主要介绍了各种浏览器下的css hack兼容性写法,css hack大致可以分为内部hack和选择器hack以及html头部引用hack,需要的朋友可以参考下 由于不同浏览器所遵循的标准也有所不同,再加上不可避免的程序bug、经济利益等因素的干扰。同样的网页代码(HTML + CSS),在不…

    好文分享 2025年12月24日
    000
  • 关于CSS background的使用方法

    下面为大家带来一篇css background全部汇总。内容挺不错的,现在就分享给大家,也给大家做个参考。 所有背景属性都不能继承。 1. background-color 所有元素都能设置背景颜色。 background-color的默认值是transparent;也就是说,如果一个元素没有指定背…

    好文分享 2025年12月24日
    000
  • 关于CSS3 rem(设置字体大小)的解析

    本篇文章主要介绍了详解css3 rem(设置字体大小) 教程,内容挺不错的,现在分享给大家,也给大家做个参考。 css3新增了相对单位 rem ,使用rem同em一样皆为相对字体大小单位,不同的是rem相对的是HTML根元素。鉴于很多网友提到了rem,所以我这里就对其中一个总结。 在Web中使用什么…

    2025年12月24日
    000
  • 关于css中清除浮动塌陷的方法

    这篇文章主要介绍了关于css中清除浮动塌陷的方法,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 在大家在使用css的过程中,多多少少会遇到清除浮动这个问题。所以这篇文章给大家总结了p+css中关于清除浮动塌陷的4种方法,相信会对大家学习或者使用p+css能有所帮助,有需要的朋友们下面…

    2025年12月24日 好文分享
    000
  • 关于css过渡和3D效果的简单实现

    下面为大家带来一篇css过渡+3d效果的简单实现。内容挺不错的,现在就分享给大家,也给大家做个参考。 css过渡+3D效果的简单实现 guodu#wp{ border: 1px solid red; width: 500px; height: 500px; background-color: pin…

    2025年12月24日
    000
  • 关于css如何控制背景的分享

    这篇文章主要介绍了css控制背景示例,这里提供了css设置背景图片、设置背景颜色的方法,需要的朋友可以参考下 一、设置背景颜色:background-color 十六进制 background-color:#ff0000;英文名称 background-color:red;三原色 backgroun…

    2025年12月24日
    000
  • 利用CSS实现纯英文数字自动换行

    下面为大家带来一篇css代码使纯英文数字自动换行的简单实现。内容挺不错的,现在就分享给大家,也给大家做个参考。 当一个定义了宽度的块状元素中填充的全部为纯英文或者纯数字的时候,在IE和FF中都会撑大容器,不会自动换行 并且当数字或者英文中带有汉字时,会从汉字处换行,而纯汉字却可以自动换行。这个问题如…

    好文分享 2025年12月24日
    000
  • 关于CSS中的table-cell属性的使用方法

    table-cell属性在处理行内的等高元素排列方面非常有效,下面我们就来看一下css中的table-cell属性使用实例教程,需要的朋友可以参考下 先让我们来研究下table,那些年曾经使用的table布局为何如此辉煌荡漾呢?她的特点有哪些呢?抛弃table的兼容性、seo、加载等与本文无关的内容…

    2025年12月24日 好文分享
    000
  • 如何使用CSS的pointer-events属性实现鼠标穿透效果

    这篇文章主要介绍了关于如何使用css的pointer-events属性实现鼠标穿透效果,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 当pointer-events的值设置为none之后,浏览器将不会获得鼠标在当前位置的层上的点击事件,而造成鼠标穿透的效果!下面就来为大家展开讲解一下…

    好文分享 2025年12月24日
    000
  • css 字体单位之间的区分和字体响应式的实现

    下面为大家带来一篇css 字体单位之间的区分以及字体响应式的实现详解。内容挺不错的,现在分享给大家,也给大家做个参考。 问题场景: 在实现响应式布局的过程中,如何设置字体大小在不同的视窗尺寸以及不同的移动设备的可读性? 需要了解的有: 1.px,em,pt之间的换算关系1em = 16px1px  …

    2025年12月24日
    000
  • CSS中zoom属性和scale属性的用法及区别

    这篇文章主要介绍了css中的zoom属性和scale属性的用法及区别,是css入门学习中的基础知识,需要的朋友可以参考下 zoom 属性语法:zoom:normal | | 默认值:normal适用于:所有元素继承性:有取值:normal:使用对象的实际尺寸。:用浮点数来定义缩放比例。不允许负值:用…

    2025年12月24日
    000
  • 如何实现css绘制透明三角形

    这篇文章主要教大家使用css绘制透明三角形,css绘制三角形很简单,如何绘制透明的三角形,本文为大家解决这个问题,感兴趣的小伙伴们可以参考一下 css实现下图样式,具体像素值记不住了,很好设置,html code (2014百度秋招面试题):                             …

    2025年12月24日
    000
  • 关于css实现右侧固定宽度和左侧宽度的自适应方法

    这篇文章主要介绍了关于css实现右侧固定宽度和左侧宽度的自适应方法,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下 这篇文章主要介绍了css实现右侧固定宽度 左侧宽度自适应,这种布局比较常见,博客园很多默认主题就是这种。一般情况下,这种布局中宽度固定的区域是侧边栏,而自适应的区域是主体…

    2025年12月24日
    000

发表回复

登录后才能评论
关注微信