码迷,mamicode.com
首页 > Web开发 > 详细

css笔记

时间:2015-11-21 10:33:26      阅读:130      评论:0      收藏:0      [点我收藏+]

标签:

一。html与css的结合的几种方式

1.行内式  在标签内直接加style属性   例如<div style="background-color:#0FF color:#F00">asd</div>

2.嵌入式  利用style标签结合    例如<style type=text/css>

                                                                div{

                                                                         background-color:#00F

                                                                       }

                                                         </style>

3.导入式 @import url();   例如<style type=text/css>

                                                      @import url(public.css)

                                                </style>

4链接式   例如<link href="mystyle.css" rel="stylesheet" type="text/css" />

二。CSS样式定义:选择器名称{属性名1:属性;属性名2:属性。。。}

                             属性名与属性之间用:

                             属性与属性之间用;

常用的选择器:

1.标签选择器 (html)  例如<style type=text/css> 

                                              p{ font-size:12px; color:red; background:blue; } 

                                        </style>

2. 类选择器(class)例如<p class=hi>hi everyone</p>

                         style内   p.hi{。。。} 只包含<p>标签中class为hi的部分   

                                或者.hi{。。。}包含所有标签里class为hi的部分

3.id选择器(id)例如<p id="hi">hi everyone</p>

                         style内  p#hi{。。。}只包含<p>标签中id为hi的部分

                                或者#hi{。。。}包含所有标签里id为hi的部分  

4.群组选择器     例如

h1{color:#0FF}

h2{color:#0FF}

h3{color:#0FF}                       等价于h1,h2,h3,h4,#asd,.sdf{color:#0FF}

h4{color:#0FF}

#asd{color:#0FF}

.sdf{color:#0FF}

5.后代选择器    中间用" "(&nbsp) 隔开

                        例如      .haha #asd{。。。}

6.子选择器    中间用">"

                      例如   h1 > strong {color:red;}

                        <h1>This is <strong>very</strong> <strong>very</strong> important.</h1>
                        <h1>This is <em>really <strong>very</strong></em> important.</h1>

7.相邻兄弟选择器 用+连接两个标签的,前提是他们拥有同一个父亲,他是以最后一个标签为目标选择的

                     例如

                     <table>

                        <tr>

                         <td>asd</td>

                         <td>asd</td>

                         <td>here</td>

                        </tr>

                     </table>

td+td+td{。。。}表示对here的修改

 

 

                              

 

 

 

 

 

 

 

                      

 

css笔记

标签:

原文地址:http://www.cnblogs.com/JLUyeyu/p/4979758.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!