视频: Web 前端系列课程7 | Html中如何插入图片img? | html+css入门开发 2024
Dreamweaver极简主义图像编辑工具允许您进行初步的图像编辑,例如调整大小和裁剪,您可以在属性检查器中找到这些工具
您不需要在Dreamweaver中创建图像,因此Adobe提供了Illustrator(图形文本,页面背景图像,导航图标等)和Photoshop(用于准备Web的照片)以及其他工具。一般来说,请坚持为这些程序中的Web准备图像。
<! - 1 - >要插入图像,请确保在“设计”视图中工作(或者在分割视图中,光标位于窗口的“设计”一侧)。有两条基本路径:从机器插入或使用复制在任何一种情况下,您都需要进入设计视图(选择视图→设计;或者对于分割视图,选择e查看→代码和设计)在粘贴或嵌入时查看图像。
插入图像的HTML页面可能会包含一些文本。所以,第一步是找出你想要的图像出现在哪里。
<! - 2 - >与印刷设计不同,网页中的图像不会放置在特定位置。这促使设计师坚果。
因此,要将计算机中的图像文件插入到Dreamweaver中的打开的HTML网页中,请执行以下步骤:
-
单击文档窗口中要插入图像的位置。
在这一步中,您可以找到您的HTML代码中插入图像的位置。再次,图像的显示位置和方式将用CSS定义。
-
选择插入→图像。
-
在打开的“选择图像源”对话框中,导航到并选择计算机上的任何文件。
如果您选择的图像位于站点文件夹之外,将出现一个有用的对话框,提示您将该图像的副本保存到Dreamweaver站点的根文件夹中。
-
单击是。在“文件复制为”对话框中单击“保存”。
-
定义可访问性属性。
-
-
默认情况下,Dreamweaver“图像标记辅助功能属性”对话框会在图像最终插入页面之前显示。
“替代文本”字段是此对话框中两个选项中最重要的一个。它显示在阅读器软件中为视力不佳的访问者朗读的文本,以及在禁用图像显示的浏览环境中显示的文本。替代文字可以并且通常应该包括大写和小写字母,空格和特殊字符。
如果视力受损的访问者或浏览环境中不支持图片的人员是您的目标受众的一部分,则可以考虑使用更实质的图片说明来创建HTML文件。通过在“图像标签可访问性属性”对话框的“长描述”框中定义链接,可以将这些文件链接到图像。
单击确定插入图像。
-
此时,您只插入了图像。页面设计,包括放置图像和流动文本,使用CSS