建站学习网,专业提供各类建站教程,网页素材,SEO资讯等建站资源!

网站模板_网站源码_网站素材_建站教程_建站学习网

当前位置:建站学习网 > 网页设计 > Dreamweaver教程 >

网页制作入门教程:关于css样式表

更新时间:2017-04-11整理编辑:建站学习网阅读:0
关于CSS样式表  
 
一.在学习css之前你应该掌握哪些基础知识  
 
1.什么是网页,什么是超文本语言(html)。  
 
2.会使用Dreamweaver等常用的网页编辑器。  
 
Dreamweaver是现今最好的网站编辑工具之一,而Dreamweaver8增加的对CSS的支持更是你容易得来使用CSS,用它来给制作网页的CSS样式表会更简单、更方便。本教程教你如何利用Dreamweaver8在页面中加入CSS,你不用死记硬背的记代码标记,也不用去看很厚的CSS手册,你就可以轻松自如的在网页中运用CSS。不过首先你要对CSS有一定的了解。因此,本教程的前面4章为CSS理论知识,主要是对CSS的全面介绍,希望读者看后对CSS的语法、结构、应用有一个全面的了解;后面4章为DW实战,主要是教你如何利用Dreamweaver8灵活运用CSS在网页中。阅读此文前,你需要对HTML有一定的了解,并会使用Dreamweaver。  
 
二.认识CSS   
 
CSS就是Cascading Style Sheets,中文翻译为“层叠样式表“,简称样式表,它是一种制作网页的新技术。  
 
网页设计最初是用HTML标记来定义页面文档及格式,例如标题<h1>、段落<p>、表格<table>、链接<a>等,但这些标记不能满足更多的文档样式需求,为了解决这个问题,在1997年W3C(The World Wide Web Consortium)颁布HTML4标准的同时也公布了有关样式表的第一个标准CSS1, 自CSS1的版本之后,又在1998年5月发布了CSS2版本,样式表得到了更多的充实。W3C把DHTML(Dynamic HTML)分为三个部分来实现:脚本语言(包括JavaScript、Vbscript等)、支持动态效果的浏览器(包括Internet Explorer、Netscape Navigator等)和CSS样式表。  
 
注意:CSS需要IE4(Internet Explorer 4.0)和NC4(Netscape 4.0)以上的浏览器支持,有些效果需要更高版本的浏览器支持。  
 
三.怎样使用CSS   
 
如果你使用的是Dreamweaver MX 2004以上的版本,在定义文字字体、颜色、大小等属性的时候,查看一下代码你会发现有这样的一部分在head区域:  
 
以下是引用片段: <style type="text/css">
 
<!--
.STYLE2 {
    font-size: 16pt;
    font-family: "Courier New", Courier, monospace;
    font-weight: bold;
    color: #FF3300;
}
-->
</style>
 
  那么恭喜你,你已经使用了CSS设计网页。那么除了这种调用CSS的方法外,还有别的吗?回答是“当然有了“,下面是系统介绍标记加注法(in-line),如果只有一个HTML标记需要设定样式,则可在该标记内,加上属性 
 
以下是引用片段: style=" "   
 
以个别修订样式。
 
页面内嵌法:  
 
以下是引用片段: 
 
<style type="text/css"> <!-- body { background : white ; color : black ; } --> </style>   
 
外部调用法:  
 
以下是引用片段: 
 
<link rel="stylesheet" rev="stylesheet" href="css/style.css" type="text/css" media="all" />    
 
双表法调用样式表  
 
以下是引用片段: 
 
<link rel="stylesheet" rev="stylesheet" href="css/style.css" type="text/css" media="all" /> 
<style type="text/css" media="all">@import url( css/style.css );</style>
 
为什么要写两次呢?  
 
实际上一般情况下用外联法调用(就是第一句)就足够了。我这里使用双表调用只是一种示例。其中的"@import"命令用于输入样式表。而"@import"命令在netscape 4.0版本浏览器是无效的。也就是说,当你希望某些效果在netscape 4.0浏览器中隐藏,在4.0以上或其它浏览器中又显示的时候,你可以采用"@import"命令方法调用样式表。

本文网址:https://www.dedexuexi.com/wysj/dw/2715.html

本站部分文章搜集与网络,如有侵权请联系本站,转载请说明出处。

收藏此文 赞一下!() 打赏本站

如本文对您有帮助,就请建站学习网抽根烟吧!

支付宝打赏
微信打赏
改变IE地址栏的IE图标
« 上一篇2017年04月11日
Dreamweaver 入门教程之表格设计
2017年04月11日下一篇 »
  • Dreamweaver CS5-HTML简介
    0阅读
    1.什么是HTML HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,它规定了自己的语法规则,用来表示比“文本“更丰富的意义,比如图片,表格,链接等。浏览器(IE,FireFox等)软件知道HTML语言的语法,可以用来查看HTML文档。目前互联网上的绝大部...
  • Dreamweaver文档编辑
    0阅读
    快捷键可以提高我们平时的工作效率,今天小编为大家介绍一下dreamweaver中文档编辑快捷键。
  • 色彩模式介绍
    0阅读
    在图象和图形处理软件中,通常都使用了HSB、RGB、Lab及CMYK几种色彩模型,并且具有多种色彩模式,用来反映不同的色彩范围,其中许多模式能用对应的命令相互转换。 (一) HSB模型 基于人类对色
  • Dreamweaver教程:用dw制作图片浏览器
    0阅读
    如图所示,在很多地方我们都看到过这样的图片展示效果 ,通过点击下方的缩略图来展示不同的图片,今天我们就是要来做一下这个效果,其实方法很简单,就是给缩略图添加一个交换图像的
  • DreamweaverMX2004打造留言本详解
    0阅读
    一、IIS(Internet 信息服务)安装配置 这里以Windows Server 2003(以下简称Win2003)为例。因为Win2003是服务器级的操作系统,所以自带有IIS6.0,其它版本的系统可以在添加或删除程序添加/删除Windows组件对
 
QQ在线咨询
×
欢迎您登陆建站学习网
QQ一键登陆 建站学习网账号登录