分享

【聊代码】第三十四集 css样式(之四)

 pfm 2022-08-30 发布于广东

聊代码(第三十四集)css样式(之四)

       上集说到了选择器命名涉及的字母问题,“老小孩网”只能选用两个字母,这确实是很大的缺陷。不过,用这个方法修饰文字,代码最简单,操作最省事,还是大有可取之处的。

       我们对原来的代码只需要稍加“更新改造”,存在的不足之处就会迎刃而解。虽然,改动后的代码略微复杂点,但变化不大。改动有两处,一处是在选择器前要加一个英文符号(小黑点).;另一处是在变化文字前加<span class="字母或汉字(不含小黑点)">。

 

       代码实例:

<style type="text/css">.a{ background-color:yellow }
.b{ color:red;font-size:25px; }
.c{ color:#ff00ff;font-size:25px; }
.d{ color:#00ff00;font-size:25px; }
.e{ color:#ffc20e ;font-size:25px; }
.变{ font-size:30px;color:#ff00ff;font-style:italic; }
</style > <p><span class="a">黄色背景</span ><span class="b">红色字</span><span class="c">粉色字</span> <span class="d">绿色字</span><span class="e">橙色字<span class="变">可用汉字命名斜体字</span></p>

 

       效果:

       黄色背景 红色字 粉色字 绿色字 橙色字可用汉字命名斜体字

 

       需要说明的问题:

       有的朋友说学代码很难,也确实难,真的不能怪你。比如,对一些代码的冠名,语义的解释,往往就五花八门。不象汉语语义,盆就是盆,碗就是碗。大家也知道,翻译英文,常常会出现多个解释,尤其是给某个代码起个中文名字,很难从它的冠名上看出它的真面目。因此,我建议,不要对它的称谓冥思苦索,纠缠不休。要知道,可以不知其名,但不可以不知其用。不是嘛?懂英文的人一看到英文就能马上读出来,还知道是什么意思,但不一定会用。相反,我们不懂英文,呼不出其名,就如同是个哑人吧,但我们了解它,知道它是干什么的,知道它起什么作用。一句话,我们知其用,这才是我们的最终目的。

       说到这儿,我就要说说上面的代码了,这里会出现一大堆词儿,什么css样式呀,css样式表呀,类呀,声明呀,选择器呀,选择符呀,等等。再加上说法不一,表述不清,你一看就会头晕脑胀。其实要用大白话说是很好理解的。那个大括号就象个口袋,可以有若干个口袋,每个口袋里都装着备用的属性和它们的值。各口袋里装的属性不同或者属性同,但值不同,所以就要给这些口袋分类,命名,而在大括号前的字母或汉字就是其区别的标志,说它是选择器或说是选择符都无不可。总之,它是大括号中内容的代表,无论它是单个英文字母,或是多字母的标签代码,或是汉字,它都是带着某些属性和属性值的,只要把它提出来,放入文档,它就会发挥作用。再说文档中的 <span class="字母(或汉字)"> 它是啥意思呀?有人说 class 是指向的,也有人说 class 是选择器,这样说恐怕不好理解,我用通俗的比喻来说,在这里它是个“专职提货员”,要由它而且必须由它把我们上面说的“口袋”提过来,可以理解它是指向或选择“口袋”。而这“口袋”太繁杂,不能露面,只能引出它的代表 字母(或汉字)了。通过 <span class="字母(或汉字)">把需要的属性放入文档,放在需要修饰的文字处,从而达到所需的效果。

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多