㈠ WEB格式的图片如何保存
选择另存为。
截图保存。
互联网几乎是当今最大的艺术、图形和相片分享平台之一，因此掌握一些保存为网页格式的基础知识就非常重要了。实际上，保存为网页格式是一项平衡艺术——你必须在图片品质和介质的文件尺寸之间做好平衡，以便满足你的个人需求。
在速度相对重要的地方（如迅速地加载网站），你可能需要牺牲一些图片品质。而在品质重要的地方，则需要牺牲一点速度。这堂课程的目的就是向你介绍一些方法，在这两个因素之间寻求平衡，与此同时保留非常好的图像品质。
无损 vs 损耗数据
虽然存在有非常多的图片格式（仅举几例，如jpeg，gif和png），但是依据压缩方法不同，所有的图片都能进一步归类为两大类别：无损和有损。无损数据压缩保证了图像在没有任何品质和信息丢失的情况下重现，而有损数据压缩的结果就是可能造成品质和信息的丢失。在平面设计领域最主流的无损媒介格式包括GIF，PNG，以及TIFF，而JPEG是最主流的有损压缩的图形格式。
如何用PHOTOSHOP保存网页格式
PS拥有非常好的方法来为网页优化图片。在ps中，选择文件>存储为web格式或者使用快捷键ctrl+alt+shift+s。一个新的对话框将会弹出，这里有所有为网页保存和优化图片的设置。
我会通过以下一些生活中的案例来演示如何使用对话框中的设置。
为网页存储图像
由于图片巨大的文件体积，它们更多是以有损压缩格式来保存的。甚至在拍照时，相对于数倍大小的RAW格式，相机也倾向于用有损格式（如JPEG）来保存图片。
JPEG是日常中首选的图片格式，它是以它的创造者“联合图像专家小组”来命名的。Jpeg之所以能够成为标准，是因为它在压缩图像数据的同时可以保留高品质，并且在相关信息上能够接近无损图像的效果。
当你在保存图片的时候，有几种网页格式预设可供选择。对于一张图片，你应该考虑是使用JPEG 低、JPEG 中，还是JPEG高。观察下面的对比图，（可以）发现案例中的图片经过压缩后并没有多大的品质损耗。相比起超过250KB的源文件，我们选择中等质量或者高等质量的压缩预设就能够得到一个大小不超过30KB，并有合适品质的图片。
GIF图像
有些时候，你会被要求用无损格式来保存，以便最好地优化你正在创作的任何作品。这在网页设计中时常遇到，在布局上使用比普通图片更少的颜色。
GIF，全称为“图像互换格式”，是一种只用到256个颜色调色板的图片格式，这让它成为不需要使用太广泛色域的网页图片的理想选择。GIF也能将单个像素设置成透明，不过这并不在这个教程的讨论范围之内。下面展示了一张(使用着256个颜色的)GIF图像和JPEG图像的对比照，它们拥有同样的大小.正如你所见到的，无损GIF图片能更好的接近源文件。
因为GIF图像受到256色的限制，它本应该极少被用到图片中，但是他们恰好适合那些使用纯色或是有限色彩的图像。对于图片来说，通常来说不是使用JPEG有损压缩，就是GIF无损格式。
高品质图像和无损PNG
PNG，全称为“可移植网络图形”，是一种类似于GIF的无损格式，只是它支持更为丰富的色彩（有时候也让它的体积变大），而且可以支持带透明图层的Alpha通道，而非单一透明像素。
PNG图像正在日渐取代GIF，主要是因为在支持更丰富的色彩方面，png通常比gif的压缩效果要更好。虽然它还不想GIF有广泛的支持，但是无疑它正朝着那个方向前进。
当图片必须保留完整品质在网络上进行传输的时候，PNG是最佳的选择。比起用JPEG传输图片，（PNG）会令你得出更大的图片大小，但是有时候这是一个非常有必要的牺牲。当一个图片包含锐利的线条、以及必须保留清晰的文字时，PNG通常是一个更好的选择，当然了，最终还是要由设计师来决定使用哪一种格式。
㈡ 怎样制作自己的网页 web开发教程 企业建网站
我这边主要介绍一下企业找外包团队制作网站的一些流程，一般都是这样：
第一个步骤，就是网站制作公司的人员，来公司了解一下客户的主要目标和想法。一般的用户可以在这一步的时候，认真的跟网站制作公司的人员进行沟通。只有这样才可以做好网站。
第二个步骤就是进行初步的网站构架。这个主要是为实现网站的基本功能而坐的。有的网站看着很花哨，其实构架很简单，但是有的功能比较复杂。根据网站制作的技术人员的说法，网站框架的搭建比较考验技术，但是网站的整体就比较考验网站美工设计的能力。
第三个步骤就是网站的功能开发。如提交一个信息是否方便，是否能够有效传达企业的信息等。包括页面的特效，菜单展现形式，这些尽管策划人员前期已经规划，但是还是需要在网站功能开发中参与，以保证网站功能与开发需求的一致性，工作量少，但是却不可忽略。
第四个步骤上传网站并测试。网页制作完毕，最后要发布到Web服务器上，才能够让全世界的朋友观看，现在上传的工具有很多，如LeadFTP，CuteFTP是常用的网页上传工具。
网站开发制作的过程耗时还是蛮久，如果用网站模板制作，就会方便快捷很多。
㈢ WEB图像格式主要有哪些各有什么特点
1、PNG（Portable Network Graphic）
PNG 格式是WEB图像中最通用的格式。它是一种无损压缩格式，但是如果没有插件支持，有的浏览器可能不支持这种格式。PNG格式最多可以支持32位颜色，但是不支持动画图。
2、GIF（Graphics Interchange Format）
GIF 是 Web 上最常用的图像格式，它可以用来存储各种图像文件。特别适用于存储线条、图标和电脑生成的图像、卡通和其它有大色块的图像。GIF文件非常小，它形成的是一种压缩的8位图像文件，所以最多只支持256种不同的颜色。Gif支持动态图、透明图和交织图。
3、BMP（Windows Bitmap）
BMP 格式使用的是索引色彩，它的图像具有极其丰富的色彩，可以使用16M色彩渲染图像。此格式一般用在多媒体演示和视频输出等情况下。
4、TIFF（Tag Inage File Format）
TIFF 格式是对色彩通道图像来说最有用的格式，支持 24 个通道，能存储多于 4 个通道。TIFF 格式的结果要比其它格式更大、更复杂，它非常适合于印刷和输出。
5、JPEG（Joint Photographic Experts Group）
JPEG 是 Web 上仅次于 GIF 的常用图像格式。JPEG 是一种压缩得非常紧凑的格式，专门用于不含大色块的图像。JPEG的图像有一定的失真度，但是在正常的损失下肉眼分辨不出 JPEG 和 GIF 图像的差别，而 JPEG 文件只有 GIF 文件的 1/4 大小。JPEG 对图标之类的含大色块的图像不很有效，不支持透明图和动态图。
6、TGA（Targa）
TGA 格式与 TIFF 格式相同，都可以用来处理高质量的色彩通道图形。
另外，PDD、PSD 格式也是存储包括通道的 RGB 图像的最常见的文件格式。
㈣ web图象是什么
放在WEB中的图象呀!
常见的Web
图像格式
有三种：
JPG格式
、GIF格式、
PNG格式
。JPG与GIF格式大家已司空见惯，而PNG格式（Portable
Network
Graphics的缩写）则是一种新兴的Web图像格式。
㈤ web前端学习HTML的图像标记有哪些
图像的标记属性主要有：
<img>称为图像标记，用来在网页中显示图像。使用方法：<img src=''路径/文件名.图片格式"width="属性值"height="属性值"border="属性值"alt="属性值">
<img>标记主要有以下属性：
1：src属性指定我们要加载的图片的路径，图片的名称以及图片的格式
2：width属性指定图片的宽度
3：height属性指定图片的高度
4：border属性指定图片的边框宽度
5：alt属性有两个作用：
① 如果图像加载失败，会用文字来代替图像显示。
② 搜索引擎可以通过这个属性的文字来抓取图片。
注意：<img>是单标记，不需要使用</img>来闭合
㈥ 前端web的点9图效果实现
这里只是一个怕自己忘记写的一个笔记，不是很全很详细，建议还是看 官方教程
图片原始像素是348 x 220
我的需求是拉伸image可以自适应内容长度，但是拉伸不能导致两边的半圆被拉成椭圆
border-image可以使用图片作为border(标准说法：border-image CSS属性允许在元素的边框上绘制图像), 给出图片后可以通过相应的参数来调整图片的拉伸，这样就可以像点9图那样保留部分内容不变的情况下，拉伸可拉伸部分来自适应。
我主要解释一下 border-image: url("") 0 170 0 170 fill / 1px 170px stretch ,
这里0 170 0 170就是划分了原始图片内容,称之为border-image-slice
后面的 1px 170px 指的是border-image-width ，字面意思是边框图片宽度，作用是将 DOM 节点分割成九宫格，这里指的就是作为实际容器的那个节点的显示范围了，我也设置为170， stretch作为border-image-repeat说明图片在超过原始长度后使用拉伸的方式
这里有更易读，更详细的文章 border-image的正解用法
点九图编辑器
https://developer.mozilla.org/zh-CN/docs/web/css/css_backgrounds_and_borders/border-image_generator (这个加载不出预览图)
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Backgrounds_and_Borders/Border-image_generator （这个可以加载出预览图）
㈦ web如何设置页面一打开就下来一个图片
、内容图片
内容图片是页面中真正的内容，没有内容图片，就无法完整的理解页面内容。如淘宝网上的商品展示图片，这些图片是网页的一部分，它们能帮助你决定这个页面的内容是否是你需要的。
web前端怎么设置页面图片背景（web页面添加背景图）
内容图片
2、布局图片
布局图片出现在页面背景中，要想理解页面的内容，它们不是必须的。如苹果官网的这个图片，没有这个图片也能理解页面上文字描述的内容是什么意思。
web前端怎么设置页面图片背景（web页面添加背景图）
布局图片
3、交互图片
图中用红色框起来的图片会给你浏览页面的时候带来一些帮助，如搜索图片，一看到就知道这里可以搜索想要的东西，购物车图片可以看到选购的产品，箭头图片点击可以看到更详细的产品等。
web前端怎么设置页面图片背景（web页面添加背景图）
交互图片
二、创建内容图片
在HTML中我们用 img 标签创建图片，英文是image的缩写。
<img src="" alt="">
web前端怎么设置页面图片背景（web页面添加背景图）
内容图片
img是空标签，没有结束标签
src属性的值是一个图片的URL地址，地址可以是相对路径，也可以是绝对路径
alt属性：填写对这张图片的简单描述，增加图片的可访问性
图片应该被存放在单独的文件夹中，如：images文件夹
三、创建布局图片
布局图片是在CSS中被创建出来的，使用CSS中的background属性，如：
1）background-color 定义背景颜色，设置背景图片时，要始终设置背景颜色，确保背景图片没有成功时会显示一个背景颜色
2）background-image 可以指向一个相对路径或者绝对路径来添加图片。
3）background-repeat可以设置背景是否平铺在容器中，包含四个关键字：
background-repeat：repeat 可以设置背景图片横向和纵向都平铺。
background-repeat：no-repeat 设置图片不平铺，图片默认显示在容器的左上角
background-repeat：repeat-x 设置图片只能在横向平铺
background-repeat：repeat-y 设置图片只能在纵向平铺
4）background-position 属性可以控制背景图片显示在什么位置，包含两个关键字，如：
background-position：top left 设置图片显示在容器的左上角，第一个关键字可以是top、center、bottom，第二个关键字可以是left、center、right
CSS中和背景相关的属性可以简写在一行中，如：
background: #FF1298 url(images/logo.png) center right no-repeat;
首先是图片的颜色color，image，position，repeat，CSS属性能用简写就尽量用简写，简写比分开写性能更高。
web前端怎么设置页面图片背景（web页面添加背景图）
布局图片
四、创建用户交互图片
Web上最常用的三种图像格式
1）Jpeg 可以展示一张照片或者复杂图像
可以表示多达1600万种颜色，即所有的十六进制颜色
不支持图像透明
不支持动画
扩展名为.jpg或.jpeg
2）png最适合展示网页插画、logo和网页小图标
可以表示上百万种不同颜色的图像
包括png-8、png-24和png-32，取决于想表示多少种颜色
可以设置颜色透明
不支持动画
扩展名为.png
3）gif适合展示网页插画、logo和网页小图标
可以表示最多256种不同颜色
可以设置颜色透明
支持动画
扩展名是.gif
建议：
复杂颜色的图像和照片则要使用jpeg格式
动态图像要使用gif格式
png格式的透明图片要比gif格式的更平滑
这三种图像相对于其他格式的图像文件比较小，适合web页面高效展示
一般情况下用户交互图片都是一些小图标，所以使用png或gif作为用户交互图片；使用CSS的background属性以背景图片的形式为网页添加用户交互图片；推荐把用户交互图片放在同一个文件中，可以提高网络和服务器性能，