一:图片标签
格式:
<img src="" url=""></img>
属性值 | 说明 |
src | 图像地址 |
alt | 添加图像代替文字 |
width/ height | 设置图像宽度/高度 |
border
title | 设置图像边框
鼠标放在上面显示的文字 |
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>图片</title>
</head>
<body>
<img src="//img10.360buyimg.com/da/jfs/t20521/203/2484699048/179379/5cfad567/5b570de2N5210f343.jpg"></img>
<img src="./t.jpg" border="5" alt="图像代替文字" title="鼠标指向的文字"></img>
</body>
</html>
二前端和美工的配合:
常见的图片格式:
PNG:透明,无损压缩(渐进显示【一行一行的加载】,留式读写【先看模糊图片再逐渐清晰的方式】 保留图像名称 作者版权创作时间)
缺点:色彩支持少,保存成png颜色少,ie6对png不支持。
GIF:动态图可透明,体积小,处理256种颜色 处理锯齿效果不好‘【百度地图】
SVG:矢量图形,无损压缩。缺点:浏览器支持不好,主要用于移动端。