1em并不是固定等于多少像素的,是根据元素的字体大小而定,如果是等宽字体,1em就是1个字符的宽度,如果是比例字体(只有英文字体才有)则1em等于英文大写字母“M”的宽度。操作方法如下:
1、首先新建一个html和css文档。
2、chrome默认是16px大小。
3、1em就是继承父元素不变。
4、2em这里就是32px。
5、1rem在这里也是16px,因为浏览器默认16px。
2018.7.16
em,px,都为长度单位,CSS直接设置就可以。
%不是一个长度单位,比如2%就是一个完整的值,是一个整体,比如0.02是一个值,没错,2%也同样是值(出处:《css世界》)
注:有一个特殊情况需要注意,如果,p为span的父元素(如下情况)
css里设置为
p{font-size:14px}
span{font-size:0.8em}
自然就会继承父元素,然后再进行子元素的独特性,即(14*0.8=11.2px)以父元素的px为单位。
简写:当值为0px时,可以简写为0。(如下图所示)
颜色设置有 三种方法
第一种就是直接用英文名字(p{color:red})第二种就是根据R(red)G(green)B(blue)颜色的比例来配色,每一项地值在0-255之间,也可以用百分比(p{color:rgb(133,45,200)})第三种就是常用的,原理也是rgb设置,但是将255变成了十六进制(p{color:#336699})
补充:background-color属性接受任意合法的CSS颜色值,如预定义颜色名、十六进制数值、RGB值、RGB百分比、RGBA值、HSL值、HSLA值(这些都是颜色设置的)
tips:1.十六进制的如果每两个之间数字相同可以简写成一个,如上面的p{color:#336699}为p{color:#369}
2.RGB和我当时学的美术的三原色相类似,美术三原色为红黄蓝。(三间色可以直接用三原色调出,红黄为橙,红蓝为紫,黄蓝为绿)
之前一直分不太清楚,今天试了一下,然后懂了。(如下图)
margin为边界,又可以叫做外边框;padding为内边框,也为“填充”。
流动模型为网页的默认模型,流动模型的块元素是自上而下,行元素是从左到右显示。
模型移动(以层模型中的元素为例)
向右移动和向下移动不是我想的right:XXbottom:XX
而是距离左边XX,距离上面XX,距离原来的0,动了XX那么多,自然就是向那里移动了XX。(默认位置为左上角)
另外,层模型使得元素块移动后,它移动前的仍然保留。
px表示像素 (计算机屏幕上的一个点:1px = 1/96in),是绝对单位,不会因为其他元素的尺寸变化而变化;
em表示相对于父元素的字体大小。em是相对单位 ,没有一个固定的度量值,而是由其他元素尺寸来决定的相对值。
CSS是指层叠样式表,层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。
CSS为HTML标记语言提供了一种样式描述,定义了其中元素的显示方式。CSS在Web设计领域是一个突破。利用它可以实现修改一个小的样式更新与之相关的所有页面元素。
CSS是一种定义样式结构如字体、颜色、位置等的语言,被用于描述网页上的信息格式化和现实的方式。CSS样式可以直接存储于HTML网页或者单独的样式单文件。无论哪一种方式,样式单包含将样式应用到指定类型的元素的规则。外部使用时,样式单规则被放置在一个带有文件扩展名_css的外部样式单文档中。