调整图片大小
有滚动条的图片可给不了好的用户体验，为了让图片的大小更适合浏览器窗口。这时候就需要对图片的大小进行调整看书之前。
我调整图片大小的方式是在<img>元素使用 width 和 height 属性。书中不建议这样做。

因为这样做仍然会下载完整的大图像，然后让浏览器来完成调整图片大小的工作，而且有些浏览器还不支持这个功能（比如低版本IE）→_→而且增加网页质量。
最优的解决方法
使用图片处理软件，比如photoshop来调整图片大小，并保存JPEG格式。为什么用JPEG格式？因为JPEG格式允许你需要的图像质量等级。等级越低，文件越小
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　P180~188  TIME2016/5/13
visibility: hidden;

常用的display值是 none 。一些特殊元素的默认 display 值是它，例如 script 。 display:none 通常被 JavaScript 用来在不删除元素的情况下隐藏或显示元素。

它和 visibility 属性不一样。把 display 设置成 none 不会保留元素本该显示的空间，但是 visibility: hidden; 还会保留。
html头部定义解析

html4.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 //EN" "http://www.w3.org/TR/html4/strict.dtd">

HTML 表示这个<html>是页面的根（第一个）元素，

 PUBLIC 表示HTML4.01标准是公共可用的。

"-//W3C//DTD HTML 4.01 Transitional//EN" 表示这个页面是使用HTML4.01版本，另外这个html标记用英语编写

"http://www.w3.org/TR/html4/strict.dtd" 这指向一个文件，标示这个特定的标准。

XHTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.1 //EN" "http://www.w3.org/TR/xhtml111/DTD//xhtml111.dtd">

!DOCTYPE HTML PUBLIC 仍然是一个html版本，xml与xml的版本

DTD XHTML 1.1 这个对应XHTML1.1版本

http://www.w3.org/TR/xhtml111/DTD//xhtml111.dtd 指向xhtml1.1的定义

head First HTML与CSS读书笔记的更多相关文章

  1. css读书笔记4：字体和文本

    字体属性网页中的字体有3个来源:1.用户机器中安装的字体:2.保存在第三方网站上的字体.可以使用link标签把它们链接到页面中:3.保存在子集的web服务器上的字体.可以使用@font-face规则随 ...

  2. css读书笔记3：定位元素

    定位元素要掌握css技术,核心就是要掌握元素定位. 一般把下面这条规则作为所有css样式表的第一条,初始化所有元素的内边距和外边距都为0: * {padding:0;margin:0;} 盒模型浏览器 ...

  3. css读书笔记2：css工作原理

    css就是一种先选择html元素,然后设定选中元素css属性的机制.css选择符合要应用的样式构成一条css规则. 为文档添加样式的3种方法: 1.行内样式,直接写在特定标签的style属性中:2.嵌 ...

  4. css读书笔记1：HTML标记和文档结构

    块级元素和行内元素:块级元素:上下堆叠,每个块级元素都独立占一行.块级元素的盒子宽度与父元素同宽.行内元素:左右堆叠,只有在空间不足的情况下才会折到下一行显示.行内元素的盒子会收缩包裹其内容,并尽可能 ...

  5. 超越css读书笔记

    一.运用所有有效的css选择符 1.属性选择符(基于一个元素是否有属性名称,例如href,或者属性值) 例如:img[alt]{border:1px;} 所有包含alt属性的图像都将会有一个灰色的边框 ...

  6. CSS读书笔记（3）---清除浮动的几种方法

    浮动元素容易造成页面错位现象.下面说说关于清除浮动的几种方法. 首先.先创建一个浮动导致错位的页面. <!DOCTYPE html> <html lang="en" ...

  7. CSS读书笔记（2）---简易相册和日历表的制作

    一.HTML和CSS制作的简易相册 相册在默认情况下是缩略图显示,而且是截取相片的某一部分显示的.当鼠标停留在某张缩略图上,相册列表中的缩略图变为大图,展示在相册的左边区域, 同时缩略图部分变成空的 ...

  8. CSS读书笔记（1）---选择器和两列布局

    (1)CSS选择器优先权选择. 优先权从大到小的选择如下: 标有!important关键字声明的属性 HTML中的CSS样式属性 <div style="color:red" ...

  9. 【精通css读书笔记】 第八章 布局

    学习了css布局的基础后又来翻阅<精通css>这本经典书籍,对布局有了进一步的认识. 基于浮动的布局 两列的布局仍然是使用一个元素向左浮动,一个元素向右浮动,值得注意的是要加入displa ...

随机推荐

  1. spoj-694-Distinct Substrings(后缀数组)

    题意: 给定一个字符串,求不相同的子串的个数 分析: 每个子串一定是某个后缀的前缀,那么原问题等价于求所有后缀之间的不相同 的 前 缀 的 个 数 . 如 果 所 有 的 后 缀 按 照 suffix ...

  2. 火狐浏览器对border-radius的渲染问题

  3. 【转】Android实例剖析笔记（二）--用实例讲解Andriod的开发过程，以NotesList为实例介绍Android的菜单机制

    原文网址:http://kb.cnblogs.com/page/78304/ 简介 android提供了三种菜单类型,分别为options menu,context menu,sub menu. op ...

  4. 【转】android ListView详解---- 不错不错

    原文网址:http://www.cnblogs.com/allin/archive/2010/05/11/1732200.html 由于google doc 很多人都打不开,故更新了源码下载地址 [源 ...

  5. PHP去除空白字符

    例子1: <?php $var = " This is a beautiful day!"; // 删除字符串中的所有空白字符(不包括全角空格) $var1 = preg_r ...

  6. 使用DateDiff方法获取日期时间的间隔数

    一:用DateDiff方法获取日期时间的间隔数,截图 二:代码 using System; using System.Windows.Forms; using Microsoft.VisualBasi ...

  7. Chrome DevTools学习笔记

    ---恢复内容开始--- chrome和firefox的开发者工具大同小异,都非常强大.今天在博客园上看了这篇文章(http://www.cnblogs.com/Wayou/p/chrome-cons ...

  8. Json.Net学习笔记(十) 保持对象引用

    更多内容见这里:http://www.cnblogs.com/wuyifu/archive/2013/09/03/3299784.html 默认情况下,Json.Net将通过对象的值来序列化它遇到的所 ...

  9. NOI题库2454 雷涛的小猫

    2454:雷涛的小猫 总时间限制: 20000ms 单个测试点时间限制: 10000ms 内存限制: 65536kB 描述 雷涛同学非常的有爱心,在他的宿舍里,养着一只因为受伤被救助的小猫(当然,这样 ...

  10. 浅谈二维RMQ

    针对一些二维区间最值问题,用一维RMQ来解决显然是不够的.所以,要改进算法.鉴于网上没有PASCAL版的RMQ标程与解析,所以小可在这里简单的讲一下. 核心思想和一维的一样,只是在计算区间时略有不同. ...