当您使用 Dreamweaver 创建一个网页并准备添加 CSS 样式表时,您可以通过以下步骤将样式表链接到您的网页:
- 在 Dreamweaver 中选择要链接到样式表的 HTML 文件。
- 打开“属性”面板,这可以通过在菜单栏中选择“窗口->属性”或通过按F4键来完成。
- 在“属性”面板中,找到“链接样式表!”这个选项。单击下拉菜单并选择“新的外部样式表”。
- 在“新样式表”对话框中,指定样式表的名称和文件路径。您可以使用默认的文件名和路径,也可以通过单击浏览按钮进行自定义。
- 单击“确定”按钮。此时,Dreamweaver 会自动为您创建一个空的 CSS 文件并将它链接到您的 HTML 文件。
- 在 CSS 文件中定义样式并保存文件。
除了上述方法外,您还可以通过快捷键创建样式表链接。对于 Mac 用户,您可以使用Command + Alt + S 快捷键打开“新样式表”对话框,对于 Windows 用户,您可以使用Ctrl + Alt + S快捷键。
以下是两条示例说明:
- 以网页结构为基础使用 CSS:
在 HTML 文件中创建常见的标题和段落元素。为了使用样式表定义这些元素的样式,需要将样式表关联到您的 HTML 文件。
在 Dreamweaver 中,选择要链接到样式表的 HTML 文件。在“属性”面板中,找到“链接样式表!”选项,并选择“新的外部样式表”。在“新样式表”对话框中指定样式表的名称和文件路径。在 CSS 文件中指定标题(h1,h2 等)和段落(p)的样式。
- 在网页中添加背景图片:
在 Dreamweaver 中,选择要链接到样式表的 HTML 文件。在“属性”面板中找到“链接样式表!”选项,并选择“新的外部样式表”。在“新样式表”对话框中指定样式表的名称和文件路径。在 CSS 文件中使用background-image属性添加背景图像:
body {
background-image: url("background.jpg");
}
这将在包含 HTML 文件和 CSS 文件的同一目录中查找名称为“background.jpg”的图像文件。如果图像位于另一个目录中,需要指定绝对或相对路径。