HTML按钮添加图片背景及超链接

(一)添加图片背景

{1}按钮添加有button和input两种方法

①用<button> 标签给html添加按钮<button type="button">Click Me!</button>

②用input方法<input  type="button" style="width:100px;height:60px;" value="Let's Go">
type:说明按钮button          style:编辑按钮大小        value:按钮键字符内容显示

{区别:在 button 元素内部,您可以放置内容,比如文本或图像。这是该元素与使用 input 元素创建的按钮之间的不同之处,当然button也可以编辑按钮大小}

{2}添加图片

添加图片就是添加图像标签(<img>)和源属性(Src)
<img> 是空标签,只包含属性,并且没有闭合标签。要在页面上显示图像,需要使用源属性(src)。src 指 source。源属性的值是图像的 URL 地址。
如果名为 "boat.png" 的图像位于 www.baidu.com.cn 的 images 目录中,那么其 URL 为 http://www.baidu.com.cn/images/boat.png
定义图像的语法是:<img src="url" />,而URL 指存储图像的位置

(二)添加超链接(两种方法)

①input按钮方法添加超链接
<a href="链接">
  <input type=button onclick="location.href('连接')">
</a>

②button方法添加超链接
<a href=" 超链接">
         <button type="button" style="width: 100px;height: 60px;">Good</button>
</a>




猜你喜欢

转载自570109268.iteye.com/blog/2359970