由于这段时间在跟着教程写静态网页的项目,算是对前面所学知识的复习,没有学习新的内容,也就没有更新博客。
目前已经搭建了一个首页模块,一个列表页模块和一个注册页面。
最近除了做静态页面之外还在看大佬推荐的书籍《Head First HTML与CSS》,然后发现了一些自己之前没有注意到关于图片这一块一些细节的东西。
下面给大家详细的说一下:
img标签
<img>
标签中的alt属性是必需的属性。
图片的格式
浏览器中常用的格式为JPEG,PNG,GIF三种格式。
JPEG格式适合保存照片和其他复杂的图像。
PNG格式和GIF格式适合保存logo和其他包含单色、线条、或者文本的简单图形。
JPEG可以按照不同的质量压缩,可以很好地权衡图像质量和文件的大小,来满足各种的需求。
GIF和PNG可以建立透明背景。
GIF和PNG是无损格式,这就代表GIF和PNG比JPEG文件更大。
PNG可以可以提供比GIF更好的透明度控制,而且支持多种颜色,GIF只支持256种颜色。
PNG格式有3种不同的格式和大小:
PNG-24 —— 支持数百万种颜色
PNG-16 —— 支持数千种颜色
PNG-8 —— 支持256种颜色
支持的颜色越多,代表文件越大。
JPEG格式包含了1600万种颜色的图像。
图片的大小
当网页内的图片需要改变大小时,最好直接改变原图片的大小,尽量不要使用width和height属性调整。
因为浏览器在缩放图片适应页面大小之前,仍要获取整个大图像,影响加载速度。
行内引用与块引用
<q>是行内引用,标签内的内容会自动添加双引号“”
<blockquote>是块引用,引用的内容以一个新的段落来显示。