WEB页面设计中的色彩和图片设计浅谈
关关 2018-07-11 来源 : 阅读 1297 评论 0

摘要:本篇教程探讨了WEB页面设计中的色彩和图片设计,希望阅读本篇文章以后大家有所收获,帮助大家对WEB页面设计的理解更加深入。

1、插入图像常用的属性有:img标签的src和alt,这两个属性是保证img有效的最基本的要求。alt表示替换文本,当图像没法加载时出现的提示信息。

src既可以是绝对路径,也可以是相对路径。同样可以设置img的宽度和长度属性来控制显示大小。

当单独设置width和height时图像是等比例变化的。

title属性为图像的提示文字,将鼠标指在图片上时显示图片说明。

border定义图像边框的宽度,粗细程度。没有提示代码,只能强写。border=“0-某个数”

实现超链接功能时将img标签写在a标签中。定义a标记的href属性。

1 <body>

2

3     <img src="image/29.png" width=" 500" height=" 100"/><br /><hr />

4     <img src="image/42.png" width=" 500" border="3"/>

5     <img src="image/43.png" height=" 100" title=" 这是一张风景照片"/><hr />

6     <a href=" other.html"><img src=" image/37.png" width=" 600" border="5" /> </a>

7 </body>


2、图像映射

用到的标签:<map>只有一个属性name,作用是为区域命名。利用img标签的usemap属性。属性值是map标签属性加上#。

<aera>标签有五个属性。1》shape:控制划分区域的形状,设置值为:rect矩形、circle圆、poly多边形。

2》coord属性:控制区域的划分坐标。如:shape为rect时,coord=“x1,y2,x2,y2”四个坐标点的坐标。shape=circle。coord=“x,y.r”圆的性质。shape=“poly”时coord=“x1,y1,x2,y2,x3,y3.....”最少三个点。

3》href属性,设置超链接地址。

4》target属性:决定页面弹出的方式,_blank,在新窗口中显示出来。

5》alt属性。提供与区域形状相关联 的一小段文字。

 1    <div style="width: 600px; height: 600px; background-color: #00c8c8" />

2     <h1 style=" text-align :center "> 创建图像的映射</h1><hr />


4     <img src="../image/29.png" width="600px" usemap=" #Map" border="2"/>

5     <map name=" Map">

6         <area shape="rect" coords=" 18,38,123,104" href=" .html" target="_blank" alt=" 矩形定义" />

7         <area shape="circle" coords=" 204,69,41" href=" .html" target=" _blank" alt=" 圆 的定义" />

8         <area shape="poly" coords=" 285,17,344,9,380,58,329,106,273,56" href=" .html" target="_blank" alt="多边形" />

9     </map>

10

11     </div>


本文由职坐标整理发布,学习更多的网页设计相关知识,请关注职坐标设计创作网页设计频道!

本文由 @关关 发布于职坐标。未经许可,禁止转载。
喜欢 | 0 不喜欢 | 0
看完这篇文章有何感觉?已经有0人表态,0%的人喜欢 快给朋友分享吧~
评论(0)
后参与评论

您输入的评论内容中包含违禁敏感词

我知道了

助您圆梦职场 匹配合适岗位
验证码手机号,获得海同独家IT培训资料
选择就业方向:
人工智能物联网
大数据开发/分析
人工智能Python
Java全栈开发
WEB前端+H5

请输入正确的手机号码

请输入正确的验证码

获取验证码

您今天的短信下发次数太多了,明天再试试吧!

提交

我们会在第一时间安排职业规划师联系您!

您也可以联系我们的职业规划师咨询:

小职老师的微信号:z_zhizuobiao
小职老师的微信号:z_zhizuobiao

版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
 沪公网安备 31011502005948号    

©2015 www.zhizuobiao.com All Rights Reserved

208小时内训课程