将图像放入页面
Posted 汪神
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了将图像放入页面相关的知识，希望对你有一定的参考价值。
位图：
位图又叫做光栅图，是有许多像素组成的图。像素是很小的颜色块。 放大原始位图会使图像效 果失真；缩小原始位图也会使图像效果失真，因为会减小图像中的像素的数量。
计算机中可以把
在页面中常用的三种位图图像格式为：
JPEG,PNG,GIF
JEPG： 后缀名是.jpg 这是一种经过压缩的一种图像，可以很好地处理大面积色调的图像，不适合用于色彩对比强烈/有清晰边界/简单构图的图像。如LOGO，BANNER
PNG： 后缀是.png 采用的是一种无损压缩的形式，目前在web上广泛流行。 支持透明星系。即图像可以浮现在其他页面文件或者页面图像之上。(有透明通道)
GIF： 后缀是.gif 是一种图像交互格式。图像效果很差。 可以制作动画。
矢量图:
无论你放大多少倍都不会失真。 这是一种数学描述的方式来记录图像内容的图像格式。
矢量图不易制作色调复杂的图像。
分辨率：
每英寸的像素，单位dpi。 一般有屏幕分辨率和图像分辨率
BANNER 网幅广告，旗帜广告，横幅广告
将图片放入网页中：
格式：
<img src=""/> <img/>标签是单标签，在最后要加个/来进行标签的闭合。Img表示图片，src表示图片的来源，src属性制定图像所在的位置，alt属性指定关于图像的描述性文本。如果浏览器不能正确地显示图像，浏览者将看到alt属性注释的文本。
关于排版图片：
<p align="center"><img src="file://C:/Users/85060/Pictures/推文配图/20160702194337_hVkPr.jpeg"/></p>
<p><img src="file://C:/Users/85060/Pictures/推文配图/d01a330ffe33aab7d664d2059eee0e07_b.jpg" align="left"/>
<img src="file://C:/Users/85060/Pictures/推文配图/timg (2).jpg" align="right"/>
</p>
当在图形进行左对齐右对齐的时候，align属性可以放在<img/>标签里面，也可以放在<p>标签里面，而中对齐的命令放在标签<img/>里时候不起作用。
（可以这么理解，其实标签<img/>的属性命令还针对和图像并列的文本内容，可以理解使图像放在文本的左边和右边，所以属性中没有居中的使用命令）
图像文本的对齐：
<p><img src="file://C:/Users/85060/Pictures/推文配图/d01a330ffe33aab7d664d2059eee0e07_b.jpg" style="vertical-align:text-bottom"/>亡灵掌握着许多威力十足的魔法，包括操控死去的战士作战的恐怖魔法。
关键是style="vertical-align:text-top"还有style="vertical-align:middle"还有style="vertical-align:baseline"
这个baseline和那个text-botttom基本一样
图像与文本的距离: <img src="4.3.jpg" hspace=40/> 水平距离，离左右的文本
<img src="4.3.jpg vspace=50/"> 垂直距离，离上下的文本
图像的宽度和高度
<img src="路径" width="300">
<img src="路径" height="100">
改了宽度后计算机会根据指定的宽度适当地调整图片的高度。
图像加边框：
<img src="4.4.jpg" border=8/> 8是像素值，一般图像的距离值都是表示这个
页面中加水平线 在设计页面的时候经常要在网页中插入一条水平线来分割文本
<hr>标签就是放入水平线的意思 属性align编辑其对齐模式；width和size属性下填入具体数字 单位是像素。Width属性表示水平线的长度，size表示水平线的宽度
改变页面的背景： <body background="网页背景.jpg">
</body>
认识一些网站常用的Banner尺寸
Vlink属性修改链接被访问后的文本颜色
但其实用html标签来
以上是关于将图像放入页面的主要内容，如果未能解决你的问题，请参考以下文章
如何将 ASP.NET MVC 3 页面的 HTML 放入 QUnit 测试中？ [复制]