head First HTML与CSS读书笔记
调整图片大小
有滚动条的图片可给不了好的用户体验,为了让图片的大小更适合浏览器窗口。这时候就需要对图片的大小进行调整看书之前。
我调整图片大小的方式是在<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读书笔记的更多相关文章
- css读书笔记4:字体和文本
字体属性网页中的字体有3个来源:1.用户机器中安装的字体:2.保存在第三方网站上的字体.可以使用link标签把它们链接到页面中:3.保存在子集的web服务器上的字体.可以使用@font-face规则随 ...
- css读书笔记3:定位元素
定位元素要掌握css技术,核心就是要掌握元素定位. 一般把下面这条规则作为所有css样式表的第一条,初始化所有元素的内边距和外边距都为0: * {padding:0;margin:0;} 盒模型浏览器 ...
- css读书笔记2:css工作原理
css就是一种先选择html元素,然后设定选中元素css属性的机制.css选择符合要应用的样式构成一条css规则. 为文档添加样式的3种方法: 1.行内样式,直接写在特定标签的style属性中:2.嵌 ...
- css读书笔记1:HTML标记和文档结构
块级元素和行内元素:块级元素:上下堆叠,每个块级元素都独立占一行.块级元素的盒子宽度与父元素同宽.行内元素:左右堆叠,只有在空间不足的情况下才会折到下一行显示.行内元素的盒子会收缩包裹其内容,并尽可能 ...
- 超越css读书笔记
一.运用所有有效的css选择符 1.属性选择符(基于一个元素是否有属性名称,例如href,或者属性值) 例如:img[alt]{border:1px;} 所有包含alt属性的图像都将会有一个灰色的边框 ...
- CSS读书笔记(3)---清除浮动的几种方法
浮动元素容易造成页面错位现象.下面说说关于清除浮动的几种方法. 首先.先创建一个浮动导致错位的页面. <!DOCTYPE html> <html lang="en" ...
- CSS读书笔记(2)---简易相册和日历表的制作
一.HTML和CSS制作的简易相册 相册在默认情况下是缩略图显示,而且是截取相片的某一部分显示的.当鼠标停留在某张缩略图上,相册列表中的缩略图变为大图,展示在相册的左边区域, 同时缩略图部分变成空的 ...
- CSS读书笔记(1)---选择器和两列布局
(1)CSS选择器优先权选择. 优先权从大到小的选择如下: 标有!important关键字声明的属性 HTML中的CSS样式属性 <div style="color:red" ...
- 【精通css读书笔记】 第八章 布局
学习了css布局的基础后又来翻阅<精通css>这本经典书籍,对布局有了进一步的认识. 基于浮动的布局 两列的布局仍然是使用一个元素向左浮动,一个元素向右浮动,值得注意的是要加入displa ...
随机推荐
- hiho #1044 : 状态压缩·一
描述 小Hi和小Ho在兑换到了喜欢的奖品之后,便继续起了他们的美国之行,思来想去,他们决定乘坐火车前往下一座城市——那座城市即将举行美食节! 但是不幸的是,小Hi和小Ho并没有能够买到很好的火车票—— ...
- 【Express】请求和响应对象
浏览器发送的信息 app.get('/headers', function(req, res){ res.set('Content-Type', 'text/plain'); var s = ''; ...
- (转载)PHP使用empty检查函数返回结果时报Fatal error: Can't use function return value in write context的问题
(转载)http://be-evil.org/post-153.html PHP开发时,当你使用empty检查一个函数返回的结果时会报错:Fatal error: Can't use function ...
- [Locked] Palindrome Permutation I & II
Palindrome Permutation I Given a string, determine if a permutation of the string could form a palin ...
- [转]浏览器如何和Web服务器通信
http://hi.baidu.com/ywqme/item/b5297014b2e58f4e6826bb74 概述 普通网民打开网页,访问网站,并不需要了解所谓HTTP协议.作为软件工程师,了解一下 ...
- E - Find The Multiple
题目大意 找倍数 给你一个数,找到一个能数是它的倍数的数,当然这个数只能由0和1组成.......这个数最大200,比较唬人,其实这个数在最大也不超过2^64.....简单广搜一下 ///////// ...
- RabbitMQ-清空队列中(一个channel或连接中)的Unacknowledged状态的消息
清空所有:nack 时将参数delivery-tag设为0,multiple设为1. 清空小于等于某delivery-tag的所有消息:nack 时将参数delivery-tag设为正数(介于1和92 ...
- SetupFactory +添加frm2.0工具
网盘链接: http://pan.baidu.com/s/1c1DFRJM 带单独的添加frm2.0工具 原setupfactory文件下载地址:http://www.pc0359.cn/downin ...
- SDN:软件定义网络
近期高级网络课的小组任务是在老师给定的范围内自选方向主题研究并做展示报告.我们组选了sdn.原以为这东西会是工业界无人问津的概念化产品,Google了一下却发现事实上sdn挺火的,因为它可能带来的可扩 ...
- [转] 使用memc-nginx和srcache-nginx模块构建高效透明的缓存机制
为了提高性能,几乎所有互联网应用都有缓存机制,其中Memcache是使用非常广泛的一个分布式缓存系统.众所周知,LAMP是非常经典的Web架构方式,但是随着Nginx的 成熟,越来越多的系统开始转型为 ...