css基础
一、css是层叠样式表:
用于定义html显示的形式。
外部样式:
{
可以将样式定义放在一个单独文件里,后缀名为.css,在html<head>段使用<link>,
<link rel="stylesheet" type="text/css" href="单独文件的地址"/>
}
内联样式:
{
直接在html中包含一个style属性,
<h1 style="cllor:red;" ></h1>
}
嵌入式样式:
{
<style type="text/css">
样式定义
</style>
}
其中它们的优先级: 内部样式>嵌入使>外部样式
二、选择器:
类选择器: .类名{属性:值;}
.p1{color:red;}
<p class="p1"></p>
ID选择器: #id名{属性:值;}
#p1{color:red}
<p id="p1"></p>
伪类选择器:
#p1:link{} <!-未访问的链接的选择器-->
#p1:visited{} <!-已访问过的链接的选择器-->
#p1:hove{} <!-鼠标光标放在上面的链接的选择器-->
#p1:active{} <!-获得焦点的链接上的选择器-->
<p id="p1"></p>
三、css盒子模型
{内容、边框、内边距、外边距}
内边距和外边距指定的顺序分为:上右下左。
四、定位
position
(relative)相对定位:它在文档中的原始空间会保留下来。
(absolute)绝对定位:它在文档中的原始空间不会保留。
(fixed)固定定位 : 会定义在屏幕的位置。
五、浮动
用float来定义浮动,float属性的取值包括:none(不浮动)、left(向左浮动)、right(向右浮动)。
这周学习的类容比较多,自己还需要多记、多练。只有记住css中的标签和属性,才能更加好的完成页面的制作。使自己的页面更加的美观、漂亮。
当看到一个页面时,我们需要先讲网页分为头部、主体、底部。然后再添加样式和图片,这样就不会忙于不停的加div。