zoukankan      html  css  js  c++  java
  • 备忘:CSS术语词汇表——张鑫旭

    一、叨点什么

    写文章的时候经常用到一些CSS方面的专业词汇。但是毕竟芳华年少不在,脑袋有点秀逗了,很多名词都记不住,这种感觉比厕所便秘还难受。比如今天居然记不起来公司公认脸蛋最pp的同事的名字,没想到我会记不住美女的名字。我觉得我背后一阵萧瑟的秋风吹起,自己俨然成了漫画里面的程序猿——

    某天闲逛到nimbupani,发现有专门展示CSS术语的文章,哇咔咔,感觉好像咬到一口正宗的高邮咸鸭蛋一样,不过人家的是英文,所以我还要本地化润饰处理,然后,就可以留给自己备忘的哈,的说。

    二、CSS词汇我来也

    1. 属性(Property)
    应用在选择器上的样式,比如说:borderbackground之流。

    2. 值(Value)
    就是属性拥有的值嘞。比如说:1px之类,的说~~

    3. 关键字(Keyword)
    就是CSS里面很重要,很关键的单词,不可能用引号包裹的那个东东。比如说:soliddotteddashed之流,的说~~

    4. 长度单位(Length Units)
    就是值的单位,数字后面跟的些玩意。比若说,px%em等其他。

    5. 功能符(Functional Notation)
    值以函数的形式指定(就是被括号括起来的那种),主要用来表示颜色(rgba, hsla)、背景图片地址(url)、属性值、过渡动画等,好比说:rgba(0, 0, 0, 0.5)url('im.png')attr('href')scale(20)。关于功能符,更多参见这里

    6. 声明(Declaration)
    属性名+值就是声明的说,比如说:

    background: red;

    7. 声明块(Declaration Block)
    {}花括号包裹的一系列声明,如下所示:

    {
        display: table-cell;
        color: sky; 
    }
    

    8. 规则或规则集(Rule or Rule Set)
    出现了选择器,而且后面还尾随着声明块,的说,比如:

    .halibote7{
        display: table-cell;
        color: sky; 
    }
    

    9. 选择器(Selector)
    用来瞄准目标元素的东西,例如上面的.halibote7就是一个选择器的哈。更多选择器,可以参阅这里,或是看下面:
    ♀ 类选择器(Class):一般而言,以”.”这个谦卑的点号开头的选择器。很多很多的元素可以用同一个类选择器的。类嘛,生下来就是被公用的命。
    ♀ ID选择器(ID):”#”打头的,长得比较嚣张。boss感觉,所谓一山不容二虎,ID一般指向唯一元素,但是,CSS中,ID样式多用貌似也过得去,但是显然不推荐这么做的。
    ♀ 属性选择器(Attribute Selector):就是长得类似下面div[title]{},或是类似下面div[title="演示"]{},或是类似下面div[title~="演示"]{},或者是类似下面div[title^="演示"]{},或者是类似下面,div[title$="演示"]{}或者是……
    ♀ 伪类选择器(Pseudo-Classes):一般前面有个英文冒号”:”的选择器,例如说::first-child 或是 :last-child等等等等。
    ♀ 伪元素选择器(Pseudo-Elements):怎么说呢,就是会有连续两个冒号的选择器的说,好像:::first-line::first-letter::before::after。我之前有篇文章:“使用CSS3改变文本选中的默认颜色”,就是使用伪元素选择器实现。

    10. 关系选择器(Combinators)
    根据与其他元素的暧昧关系选择元素的选择器,常见的符号有空格( ),尖尖号(>),加号(+),还有弯弯号(~)等,于是就有了:
    ♂ 后代选择器(Descendant Combinator):类似#yayunhui h1{},直接把合乎条件的子子孙孙都选择了,的说~~
    ♂ 子选择器(Child Combinator):直接选择儿子,而忽略孙子以及从孙等,尖尖号就是干这个活的。
    ♂ 临近兄弟选择器(Adjacent Sibling Combinator):与其他元素直接相邻的元素的什么什么的说~~
    ♂ 一般兄弟选择器(General Sibling Combinator):也是相邻的,但是不那么直接。

    11. @规则(At-Rules)
    以@字符开始的一些规则,像是@import@page@media, 和 @font-face诸如此类。

    12. 媒体特征(Media Features)
    使用media queries属性,你可以根据不同的媒介有针对性的显示样式。当然,最常见的媒体特征应该是min-widthmin-height之类的了。

    13. 商家指定扩展(Vendor-specific Extension)
    就是一些私有属性啦。比如常见的CSS3的一些私有前缀啦,-moz-,或是-webkit-或是-o-或是-ms-之类的说,还有很多其他,IE浏览器下的私有属性貌似更多的说,就不展开了。

    三、尾声

    诶呀呀,最后几个词义好难表述啊,可能有些不准确。就这些了,用做备忘足够了,恩!
    参考文章:CSS Vocabulary 

    原创文章,转载请注明来自张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com]
    本文地址:http://www.zhangxinxu.com/wordpress/?p=1240

    (本篇完)

  • 相关阅读:
    实训9.4.前端:url、href、src,link和@import
    实训9.2.作业1.写一个10次循环,每次得到一个随机数,放进一个集合中,如果这个数已经存在集合中则跳过,最后打印集合中的数字.
    实训9.3. SQL——STRUCTURED QUERY LANGUAGE(结构化查询语言 )
    实训9.2.类集,Collection接口
    实训9.2.IDEA ——java编程语言开发的集成环境(集成开发工具)
    实训9.2. JDK——java语言的软件开发工具包(JAVA的运行环境(JVM+Java系统类库)和JAVA工具) 【java开发的核心】
    从键盘输入数据
    error
    ubuntu 14.04, Command "/usr/bin/python -u -c "import setuptools, tokenize;__file__='
    用Python徒手写线性回归
  • 原文地址:https://www.cnblogs.com/yangyang63963/p/5797170.html
Copyright © 2011-2022 走看看