关于divcss的使用详细介绍
第一步:
先建立index.html和css.css两个文件。
放在同一目录里
[建议编辑工具用dreamweaver以后简称dw]
第二步:
在index.html里的之间放入
这段代码是外部css调用,注意:href=”css.css”这是路径
因为index.html和css.css在同一目录。
第三步:
在css.css文件里编定样式。
可以用dw
用dw打开你的css.css → 窗口 → css样式 → 一般在你的右边出现css样式 → 点全部,下面会出现一个css.css → 点右键选择转到代码,这样在左边出现一个空白的板面这是因为你还没在里面编辑
第四步:
开始编定你要的样式了:
样式分两种
一种是点 . 一种是#号
先说. 如
.abc {}
点开头后面的abc是你自己定义的,为了直观大括号里我没有什么东西是因为只定义了样式名称,内容如高,宽没有定义,这样又回到右边的css样式编辑器里
这时在css.css下面出现了一个.abc的名字,你可以双击或右键选择编辑,这样会出现一个对话框。
下面说说对话框里的一些功能
分类:第一个类型是定义字体,大小,一些相关东西,一看就知道了,
第二个是背景不用说了,你一就明白了,
第三个是区块,这个自己研究一下,
第四个是方框,这个就是定义宽和高了,浮动选择一般为左对齐,下面的就是相当于,用table的,填充和间距和
第五个边框,边框,就是定义这个框的边线,大少颜色之类的,自己研究,
其它的,有少复杂,自己用多了就会知道了,
说了这么多,来个例子吧:
从出来对话框说起,
选择第二个,背景为红色[#FF0000]
选择第四个,定义宽为500px,高为300px,浮动为左对齐,点确定。
样式如下
.abc {
background-color: #FF0000;
width: 500px;
height: 300px;
float: left;
}
样式出来了,接下来就是diV的调用了,下面是index.html里面:
上面就可以浏览看出页面有一个500X300的红色块了
class=”abc”现在说明一下.和#号了
用.abc就用class=”abc”
用#abc就用id=”abc”
他们区别就是级别不一样,#号比点要级高,而且#号是唯一的,
先说级别:
如果diV用#号,定义了字为12号,黑色(id=”abc”>)
上面的六个字,为12黑色的字,
但是我想要真灵无限四个字为14号,红色(class=”123”)
这样定成
这样是没有用的,因为高级的#已经定义了,字的大小和颜色,所以要反过来,
这样才能有效果
再说说#号的唯一性,如果定义了#abc和.123这两个样式
那么id=”abc”在一个页面只能出现一次,
而class=”123”可以在多个div里面调用,
这就是id和class的区别!
打了这么多,相信基本的样式可以应用了。
原文地址:https://www.weidianyuedu.com/content/1720707687230.html
还没有评论,来说两句吧...