HTML基础样式（三）

一、设置图片1、对图片的实现方式两大类：插入图片（HTML实现）和背景图片（css样式）       设置图片大小：height（高度值）或width（宽度值）2:、设置图片和其他元素边框       （1）设置边框样式的属性：border-style；       none （无边框，默认值）| dotted （点线）|  dashed （虚线） | solid （实线） | double（双直线） | groove （凹直线）|  ridge （凸直线）|  inset （嵌入式）| outdet（嵌出式      ）               设置边框宽度的属性：border-width；
               设置边框颜色的属性：border-color；      （2）为4个边框设置不同样式                上边框 boder-top-style                            boder-top-width                            boder-top-color  下边框 boder-bottom-style                            boder-bottom-width                            boder-bottom-color左边框 boder-left-style                            boder-left-width                            boder-left-color  右边框 boder-right-style                            boder-right-width                            boder-right-color          注意：可以写一个组合复合属性（一个属性多个值）         border-left:botted样式      5px宽度 颜色（为左边框设置样式宽度颜色）     （3）设置边框样式线条（顺序是顺时针，上 右 下 左；如果是三个值 上右 下 左同右 ；两个值，上下 下同上 左同右）              border-style：上右下左（为四个边框设置样式）              border-width：（为四个边框设置宽度）              border-color：  （为四个边框设置颜色）

        3、设置图片的对齐方式               （1）水平对齐：图片的水平对齐不能通过直接设置图片的text-align属性实现，而是通过设置其父元素的text-align属性来实现。               （2）垂直对齐（在CSS中可以使用vertical-align属性来控制图片的垂直对齐方式，它主要应用在图片与文字搭配的情况下。）         4、设置图文混排（可以使用margin属性设置图片同文字之间的距离）              图片居于文字右边：float：right；              图片居于文字左边：flost：left         5、设置背景图片             插入背景图片：background-image：url（图片的路径和名称）              设置背景图片的重复方式：background-repeat：repeat （背景图片在水平和垂直方向平铺（默认值）| repeat-x（背景图片在水平方向平铺） | repeat-y （背景图片在垂直方向平铺）|no-repeat（背景图片不平铺）             设置背景图片的位置：background-position

             固定背景图片： background-sttachment：scroll （默认值。背景图像会随着页面其余部分的滚动而移动）| fixed（当页面的其余部分滚动时，背景图像不会移动）| Inherit（从父元素继承该属性的设置）         6、背景样式综合设置             background-color:red;
             background-image:url(bg6.jpg);
             background-repeat:no-repeat;
             background-attachment:fixed;
              background-position:5px 10px;              以上代码可以统一用一个属性background代替，如下：                 background:red url(bg6.jpg) no-repeat fixed 5px 10px;