css

<div class="imgLeft"><img alt="" src="style/orange/psycommon.jpg" /></div>
          <span style="float:left;">hello</span><span>world</span>

1.去掉图片的边框线

img {border-width: 0px 0px 0px 0px} 

img {border:none;}

overflow:hidden;

2.css 选择器

 类别选择器：前面以"."来标识,如：。demoDIv{。。。} ， html：<div class="demoDiv">

 标签选择器：比如：P{}

 ID选择器：根据元素的ID来选择元素，具有唯一性。前面以"#"号来标志，#demoDIV{。。。}，html：<div id="demoDiv">

 后代选择器：也称包含选择器，用来选择特定元素或元素的后代，后代选择器用两个常用选择器，中间加一个空格表示。其中前面的常用选择器选择父元素，后面的常用选择器选择子元素，样式最终应用于子元素中。比如：.father .child{。。。}，html: <p class="father"><label class="child">blue</label></p>. 更加精准的定位元素。

 子选择器：与后代选择器有区别，子选择器仅是指他的直接后代，后者可以理解为作用于子元素的第一个后代。而后代选择器是作用于所有子后代元素。后代选择器通过空格来进行选择，而子选择器是通过">"进行选择。CSS：#links a{color:red;} #links>a<color:blue;>，Html: <p id="links"><a href="#">blue</a><span><a href="#">Css1</a> </span> <span><a href="#">CSS2</a></span></p>. 第一个链接元素会显示成蓝色，而其他两个元素会显示成红色。当然，有些浏览器并不支持这样的CSS选择器。存在不兼容的现状。子选择器（>）和后代选择器（空格）的区别：都表示“祖先-后代”的关系，但是>必须是“爸爸>儿子”，而空格不仅可以是“爸爸儿子”，还能是“爷爷儿”、“太爷爷儿子”。

 伪类选择器：有时候还会需要用文档以外的其他条件来应用元素的样式，比如鼠标悬停等。这时候我们就需要用到伪类了。一下是链接应用的伪类定义：a:link{。。。}，a:visited{。。。}，a：hover{。。。}。通常只用在链接上，原因是浏览器兼容的问题。

 通用选择器：用"*"来标识。比如：*{。。。} ， 所有的元素，同时通用选择器还可以和后代选择器组合。例如：P*{。。。}。表示P元素后代的所有元素都应用这个样式。注意，与后代选择器的搭配容易出现浏览器不能解析的情况。比如：<p>red<p>blue</p><b>red</b></p>.

 群组选择器：但几个元素样式属性一样是，可以共同使用一个声明，元素之间用逗号分隔。如：p, td, li{。。。},#main p, #sider span{。。。}，.main p, #sider span{。。。} . main h1,#sider h3,.title h2{。。。} ，使用群组选择器，将大大的简化CSS代码，将具有多个相同属性的元素合并群组进行选择，定义同样的CSS属性，大大的提高了编码效率，减少了CSS文件的大小。

 相邻同胞选择器：找到兄弟两个当中的一个，如一个标题h1后面紧跟两个段落p元素，我们想定位第一个段落p元素，对他应用样式。代码如下：h1+p{color:blue}。 html:

         <h1> css

              <p>blue</p> //蓝色

              <p>red</p>   //这个不受影响

         </h1>

 +和~的区别：类似上面一个，两者都表示兄弟关系，但是+必须是“大哥+二哥”，~还能是“大哥~三弟”、“二哥~四妹”。

 属性选择器：可以用判断html标签的某个属性是否存在的方法来定义css，例如：abbr[title]{color:red;},表示abbr标签是否有title属性，如果有则应用这个样式。也可以用判断html标签的某个属性值的方法来定义css，例如：p[title='app']{color:red;}，这里所有p标签中，title属性为app的都会应用这个样式。

3. span 和 div

 所展现的效果是截然不同的。差别很大.

<span class="imgLeft"><img alt="" src="style/orange/psycommon.jpg" /></span>
          <span style="float:left;">hello</span><span>world</span>
 


<div class="imgLeft"><img alt="" src="style/orange/psycommon.jpg" /></div>
          <span style="float:left;">hello</span><span>world</span> 

4. 有关图片的拉伸问题
背景图片目前css还不支持拉伸，如果是前台图片的话是可以的

5. CSS中文字链接光标换成小手
A{cursor: pointer;}
 
6. 有关页面居中的问题： margin 和 text-align
   水平居中的text-align:center 和 margin:0 auto    
   这两种方法都是用来水平居中的，前者是针对父元素进行设置而后者则是对子元素。他们起作用的首要条件是子元素必须没有被float影响，否则一切都是无用功。margin:0 auto也可以被写成margin:0 auto 0 auto.
7. 去掉li标签前面的点
list-style:none;

.trend .leftList li{background: url(../style/orange/bullet-blue.jpg) no-repeat left 5px; padding-left:10px;}