首页前端开发CSSCSS 指针

CSS 指针

时间2024-05-20 06:24:03发布访客分类CSS浏览13
导读:什么是CSS指针?这里指针是指属于与被属于的关系 如.yangshi .yangshi_a{...} 对于yangshi_a是yangshi 指向的样式 扩展阅读:css鼠标指针、css鼠标光标、css cursor 我们可以作1个实验来理...

什么是CSS指针?这里指针是指属于与被属于的关系 如.yangshi .yangshi_a{ ...}
对于yangshi_a是yangshi 指向的样式

扩展阅读:css鼠标指针、css鼠标光标、css cursor

我们可以作1个实验来理解此CSS 指针 是什么
原CSS div样式
.yangshi{ width:300px; height:50px; border:1px solid #F00; margin:0 auto; text-align:right; }
.yangshi .yangshi_a{ float:left; width:30px; border:1px dashed #333; }
.yangshi .yangshi_b{ float:right; width:50px; border:1px dashed #333; }


内容a

内容b


浏览器显示结果:


就我们以上实例来做
我们将.yangshi .yangshi_b{ ...} 改为.yangshic .yangshi_b{ ...}
得到 .yangshic .yangshi_b{ float:right; width:50px; border:1px dashed #333; }
然后你浏览下结果

CSS指针效果

是的是不是感觉yangshi_b虽然我们在DIV使用class调用了但是失效了

怎么多中间的虚线了

那就是因为DIV独占一行的特性出来了

而内容b失效了

当然你会看到

是的 是因为CSS指针属性,看到改后yangshi_b可以理解父级(yangshic)不存在(或html中改后yangshi_b父级是yangshi而不是yangshic所以为导致yangshic指针到yangshi_b的样式失败)

这个CSS指针我们可以很好利用

比如以后我们统一css命名 比如在一个网页中很多栏目标题我们就以.titles命名 我们可以利用CSS指针给他赋予不同父级 在不同地方使用并赋予不同CSS样式,利用这一特点 让我们维护更加容易,一看此命名就知道此处是某栏目标题意思

补充CSS教程:
CSS 父级子级

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!


若转载请注明出处: CSS 指针
本文地址: https://pptw.com/jishu/663965.html
css 字体颜色(css color) DIV CSS字体(font-family)

游客 回复需填写必要信息