`
vowtree
  • 浏览: 34613 次
  • 性别: Icon_minigender_1
  • 来自: 厦门
社区版块
存档分类
最新评论

CSS+DIV

    博客分类：
  • CSS
阅读更多

1.  导入CSS

   <link href="test.css" type="text/css" rel="stylesheet">

 

2. 标记选择器   h1{}  p{}  选择HTML中所有h1以及p标签

    类别选择器   名称自定义   .one{}  .two 前面带"."   对应HTML标签  用class="one"声明

    ID选择器     #one #two  <p id="one">  ID唯一 所以只能使用一次

    集体声明      h1,h2,h3,h4{}   h2.special,.special,#one{}

 

<html>
<head>
<title></title>
<style type="text/css">
    h1{
        color : blue ;
        font-size : 18px ;
    }
    h1.special{
       color : red ;
       font-size : 23px ;
    }
    .special{
       color : green ;
    }
    
</style>
</head>
<body>
    <h1>标记选择器</h1>
    <h1 class="special">标记选择器</h1>    
    <p class="special">类别选择器</p>    
</body>
</html>

 

<html>
<head>
<title></title>
<style type="text/css">
    p b{
      color : maroon ;
      text-decoration : underline ;
    }
    
</style>
</head>
<body>
    <p>
        嵌套使<b>用CSS</b>标记
    </p>  
    嵌套之外<b>标记</b>不生效
</body>
</html>

 

 

3. 盒子模型  设定width和height的值来控制content的大小。在IE7或Firefox，width和height的值都是值width+padding或者height+padding的值。

 

 

margin 指的是元素与元素之间的距离。

若是行内元素，块与块的距离  margin-right + margin-left

若产生换行效果，则距离为max(margin-bottom,margin-top)

 

4.  

<html>
<head>
<title></title>
	<style>
		div.father
		{
		 	background-color:#fffebb;
			text-align:center;
			font-family:Arial, Helvetica, sans-serif;
			font-size:12px;
			padding:10px 20px;
			border:1px solid #000000;
		}
		div.son
		{
			background-color:#a2d2ff;
			margin-top:30px;
			margin-bottom:20px;
			padding:15px;
			border:1px solid #004993;
		}
		
	</style>
</head>
<body>
    <div class="father">
    	<div class="son">
        	子div
        </div>
    </div>
</body>
</html>
 

 

5.如果将字块的Position属性设置为absolute，这两个字块都将不再属于其父块，都相对于页面定位。

 

在IE中，只有left和top两个位置发挥作用，而right和bottom值因为冲突，没有根据需要进行调整。在设计时，只设置left和right的其中之一，以及top和bottom这两个属性中的一个。

 

 

 

 

 

 

 

 

分享到：
| jQuery 即学即用 获取控制属性
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics