CSS第一讲概要

2015-09-21 第三课 css1

  1、background 　　　　　　背景属性

　　repeat 　　　　　　   　　如何重复背景图像

　　　　no-repeat 　　    　　不做平铺

    　　 repeat 　　　　    　　图片小于容器时铺满整个容器

    　    repeat-x 　　　　 　　横向铺满整个容器

    　　 repeat-y 　　　　 　　竖向铺满整个容器

           inherit 　　　　    　　继承

　　position 　　　　　　　　  背景图像的位置

      　  10px 20px 　　    　　可以直接给坐标值表示图片的左上角位置

    　　 top 　　　　　　　　   靠近容器上边缘

    　　 bottom 　　　　　　　靠近容器下边缘

   　　  left   　　　　　　　　 靠近容器左边缘

       　 right  　　　　　　　  靠近容器右边缘

　　size 　　　　　　　　  　  背景图片的尺寸

　　　　10px 20px 　　　　　设置背景图像的高度和宽度。第一个值设置宽度，第二个值设置高度。

 　　　　　　　　　　　　　　 如果只设置一个值，则第二个值会被设置为 "auto"。

    　　  10% 20% 　　　　　以父元素的百分比来设置背景图像的宽度和高度。

　　　　　　　　　　　　　　 第一个值设置宽度，第二个值设置高度。如果只设置一个值，则第二个值会被设置为 "auto"。

    　　   cover　　　　　　　把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。

  　　　　　　　　　　　　　 背景图像的某些部分也许无法显示在背景定位区域中。

    　　　contain 　　　　　  把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域。

　　attachment 　　　　　　背景图像是否固定或者随着页面的其余部分滚动

    　　　scroll 　　　　　　   随着页面的滚动轴背景图片将移动

    　　   fixed　　　　　　　 随着页面的滚动轴背景图片不会移动

    　　　inherit 　　　　　　继承  

  2、border-collapse 表格边框样式定义

　　　　 separate 　　　　　  默认值。边框会被分开。不会忽略 border-spacing 和 empty-cells 属性。

　　　　 collapse 　　　　　　如果可能，边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性。

　　　　 inherit 　　　　　　  规定应该从父元素继承 border-collapse 属性的值。

  3、text-decoration 　　　　 文本的修饰

  　　　  none 　　　　　　    默认。定义标准的文本。

　　　　 underline 　　　　    定义文本下的一条线。

　　　　 overline 　　　　　　定义文本上的一条线。

　　　　 line-through 　　　　定义穿过文本下的一条线。

　　　　 blink 　　　　　　　  定义闪烁的文本。

　　　　 inherit 　　　　　　  规定应该从父元素继承 text-decoration 属性的值。

  4、cursor 　　　　　　　　  鼠标在元素之上时的鼠标形状

 　　　　url 　　　　　　　　  需使用的自定义光标的URL。

　　　　　　　　　　　　　　  注释：请在此列表的末端始终定义一种普通的光标，以防没有由 URL 定义的可用光标。

　　　　 default　　　　　　  默认光标（通常是一个箭头）

　　　　 auto 　　　　　　     默认。浏览器设置的光标。

　　       crosshair　　　　     光标呈现为十字线。

　　　　 pointer 　　　　　　 光标呈现为指示链接的指针（一只手）

　　　　 move 　　　　　　   此光标指示某对象可被移动。

　　       e-resize 　　　　     此光标指示矩形框的边缘可被向右（东）移动。

             ne-resize  　　　　  此光标指示矩形框的边缘可被向上及向右移动（北/东）。

　　　　  nw-resize　　 　　  此光标指示矩形框的边缘可被向上及向左移动（北/西）。

　　　　  n-resize                 此光标指示矩形框的边缘可被向上（北）移动。

　　　　  se-resize　　　　    此光标指示矩形框的边缘可被向下及向右移动（南/东）。

　　　　  sw-resize 　　　　  此光标指示矩形框的边缘可被向下及向左移动（南/西）。

　　　　  s-resize　　　　　   此光标指示矩形框的边缘可被向下移动（南）。

　　　　  w-resize 　　　　    此光标指示矩形框的边缘可被向左移动（西）。

　　　　  text 　　　　　　　  此光标指示文本。

　　　　  wait   　　　　　　   此光标指示程序正忙（通常是一只表或沙漏）。

　　　　  help　　　　　　     此光标指示可用的帮助（通常是一个问号或一个气球）。

  5、overflow 　　　　　　　  规定当内容溢出元素框时发生的事情

　　　　　visible 　　　　　　默认值。内容不会被修剪，会呈现在元素框之外。

　　　　   hidden 　　　　　  内容会被修剪，并且其余内容是不可见的。

　　　　   scroll 　　　　　　  内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。

　　　　   auto 　　　　　　   如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。

　　　　   inherit 　　　　     规定应该从父元素继承 overflow 属性的值。