用户名:  密码:   
您当前的位置:首页 > 网页设计 >  Html+CSS > 

第1课 CSS的基本知识

上次修改时间: 2015-12-14 21:32:44      来源:网络总结      作者:钢铁长陈
上一页      路径:DSD\Learn\Html与CSS\DIV+CSS\百科网DIV+CSS教程\      下一页

1.用DW新建一个html文档的第一句的作用
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
以下的作用是标明,这个文档符合html协议,和xhtml语法

2.DW8默认编码为charset=gb2312,gb2312和GBK为中文编码,国际通用的是utf-8
注:文档是什么编码,那么CSS文件就应该使用相同的编码,否则有可能出现乱码。
DW8下修改文档编码的方法:点菜单栏的修改——页面属性——标题/编码,在编码下拉列表选择你要的编码点确定即可

3.html标签,多数成对出现,也有单一标签
a.成对标签
如:<div>……</div> <p>……</p> <body></body><div></div><span></span>等
b.单一标签
如:<img src=""/> <br/>等

4.CSS与DIV
CSS属性是对应DIV的
DIV的名字有两种,一种是类,一种是ID,类可以被重复使用,可以有多个DIV都在同一类
CSS类以.点开头,id以#井号开头,例:
ID的写法:#test{background-color: #ffffff;height: 100px;width: 200px;}
类的写法:.test{background-color: #ffffff;height: 100px;width: 200px;}
语法:开头写以.或#开头的选择器也就是名称,后面接在花括号,在括号写这个选择器的多个属性,多个属性以分号隔开
调用:<div id="name"></div>  <div class="name"></div>

5.CSS的内部引用与外部引用,以及行内样式。
内部引用是把CSS代码保存到html文档中</head>前面,
<style type="text/css">
#test{background-color:#occ;height:100px;width:200px;}
</style>
外部引用是把像如上CSS代码写到一个单独在CSS文件中,在html文档中</head>前用如下代码把CSS文件引用到html文档
<link href=".../waibu.css" rel="stylesheet" type="text/css"/>
行内样式是把CSS代码写到那行标签里面,如:<p style="font-size:24px;">...</p>

6.在DW8中插入/新建一个内部外用或外部引用CSS的方法:
点菜单栏的插入-布局对像——DIV标签——输入类或ID名称——新建CSS规则——选择内部或外部引用——确定——设置规则,
“插入DIV标签”窗口:插入的CSS是类就输入类名称,是ID就是ID名称。
“新建CSS规则”窗口:如是内部引用就在规则定义处选择“仅限该文档”,如是外部引用就选“新建样式表文件”。
“CSS规则定义”窗口:设置这个CSS的各种属性,如背景,边框,列表,方框等。

7.CSS的盒模型,
border边框,margin外边距,padding内边距,height高度,width宽度,element元素。
内边距:DIV边框到边框里面内容的距离,对应CSS规则定义窗口方框——填充,自动为居中
外边距:DIV边框到边框外部内容的距离,对应CSS规则定义窗口方框——边界,


CSS盒模型(核心内容)CSS如何定位DIV的位置,两个DIV的位置如何控制及里面的内容如何控制
右边样式栏快速修改 外边距margin 方框 ,自动  内边距padding 填充