首页 > 软件开发 > CSS >

首页index.html中如何调用CSS系统和引用标签

来源:互联网 2023-03-16 19:17:41 302

网页设计中,一般从单页面中的首页设计开始,本文用图文的方式介绍如何在首页index.html文件中调用CSS中的引用标签和系统标签。让初学网页设计人员更能清楚的了解html代码的运行方式,从而在以后的设计中举一反三,灵活应用。2xa办公区 - 实用经验教程分享!

工具/原料

  • windows系统下安装Macromedia Dreamweaver 8软件
  • 网页颜色抓取工具

方法/步骤

  • 1

    打开Dreamweaver 8,分别新建html和css格式的文件,分别存放在桌面web文件夹中的根目录和CSS文件夹中。2xa办公区 - 实用经验教程分享!

    首页index.html中如何调用CSS系统和引用标签?2xa办公区 - 实用经验教程分享!

    首页index.html中如何调用CSS系统和引用标签?2xa办公区 - 实用经验教程分享!

    首页index.html中如何调用CSS系统和引用标签?2xa办公区 - 实用经验教程分享!

  • 2

    body>/body>在首页index.html中为系统标签,因此在index.css文件中定义,语句表达方式为:body{ background:#4B7E9B; padding:0; margin:0;},body标签与其它标签类似,其内部编程方式为:命令(如background),参数(如#4B7E9B(颜色代码)),上述语句的释义为:首页的背景颜色为#4B7E9B,填充为0,间距为0。2xa办公区 - 实用经验教程分享!

    首页index.html中如何调用CSS系统和引用标签?2xa办公区 - 实用经验教程分享!

  • 3

    首页index.html文件中调用刚才定义好的body标签,语句表达方式为:link href="css/index.css" rel="stylesheet" type="text/css" />2xa办公区 - 实用经验教程分享!

    首页index.html中如何调用CSS系统和引用标签?2xa办公区 - 实用经验教程分享!

    首页index.html中如何调用CSS系统和引用标签?2xa办公区 - 实用经验教程分享!

  • 4

    其它自己定义标签名称的标签为引用标签,它们的定义和调用方式与系统标签不同。某个引用标签语句表达方式为: .TOP1{ width:960px; height:30px; background:url(file:///D|/Users/ZhangZhaoJian/Desktop/web/images/topbg.gif) left repeat; float:left;},特别注意,TOP1为你自己定义的标签名称,为引用标签,为了与系统标签区别,在TOP1的前面有个 . 或 # ,在这里为 .TOP1。而标签内的语句编程方式与系统标签相同,上述语句的释义为:导航条的宽度为960像素,高度为30像素,背景是图片链接,向左填充。2xa办公区 - 实用经验教程分享!

    首页index.html中如何调用CSS系统和引用标签?2xa办公区 - 实用经验教程分享!

  • 5

    首页index.html文件中调用刚才定义好的.TOP1标签,语句表达方式为:div class="TOP1"> /div>2xa办公区 - 实用经验教程分享!

    首页index.html中如何调用CSS系统和引用标签?2xa办公区 - 实用经验教程分享!

    首页index.html中如何调用CSS系统和引用标签?2xa办公区 - 实用经验教程分享!

  • 5该信息非法爬取自百度经验
  • 注意事项

    • 注意系统标签和引用标签在css中定义的方法不同
    • 首页index.html中调用时注意对不同标签的调用语句

    以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!2xa办公区 - 实用经验教程分享!


    标签: CSS

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码