Day02 DIV和CSS
DIV和CSSHTML的块标签<div></div>:默认一个div独占一行 <span></span>:默认在同一行
CSS的概述层叠样式表 HTML相当于网站的骨架,CSS对骨架进行美化, CSS使用地方
CSS语法h1{color:red;font-size:14px;} CSS的引入方式
<html>
<head></head>
<body>
<h1 style="color:red;font-size:50px">标题</h1>
</body>
</html>
<html>
<head>
<style>
h1{
color:blue;
font-size:40px;
}
</style>
</head>
<body>
<h1>标题</h1>
</body>
</html
<html>
<head>
<link href="" rel="stylesheet" type="text/css" />
</head>
</html> CSS的选择器
<html>
<head>
<style>
div{
border:1px solid blue;
width:40px;
height:45px;
}
</style>
</head>
<body>
<div> DIV1</div>
<div> DIV2</div>
<div> DIV3</div>
<div> DIV4</div>
<div> DIV5</div>
</body>
</html>
#d1{
border:2px solid red;
}
.divClass{
border:2px solid yellow;
} CSS的浮动使用float属性完成div的浮动 清楚浮动效果:使用clear属性进行清除
CSS的其他选择器
<html>
<style>
input[type="text"]{
}
</style>
</html>
选择器,选择器{
} CSS的样式CSS中的盒子模型内边距padding 边框border 外边距margin
CSS中的定位position属性设置定位: relative:相对位置 absolute:绝对位置 fixed:修正位置
使用另外两个属性:left,top
超链接的伪类a:link{color: #FF0000}:未访问的链接 a:visited{color: #00FF00}已访问的链接 a:hover {color: #FF00FF}鼠标移动到链接上 a:active {color: #0000FF}选定的链接
显示和隐藏属性
|