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 ...
随机推荐
- 【转】java中float与byte[]的互转 -- 不错
原文网址:http://tjmljw.iteye.com/blog/1767716 起因:想把一个float[]转换成内存数据,查了一下,下面两个方法可以将float转成byte[]. 方法一 imp ...
- HDOJ(HDU) 2164 Rock, Paper, or Scissors?
Problem Description Rock, Paper, Scissors is a two player game, where each player simultaneously cho ...
- [Locked] Flip Game I & II
Flip Game I You are playing the following Flip Game with your friend: Given a string that contains o ...
- zoj 3365 灵活数字规律
题目链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3365 #include <cstdio> #incl ...
- Marzoni(玛佐尼)意大利顶级西服面料之一_HollandandSherry_新浪博客
Marzoni(玛佐尼)意大利顶级西服面料之一_HollandandSherry_新浪博客 Marzoni(玛佐尼)意大利顶级西服面料之一 (2013-01-08 17:30:04) 转载▼
- Java IO流以及装饰器模式在其上的运用
流概述 Java中,流是一种有序的字节序列,可以有任意的长度.从应用流向目的地称为输出流,从目的地流向应用称为输入流. Java的流族谱 Java的 java.io 包中囊括了整个流的家族,输出流和输 ...
- Struts2获取request三种方法
Struts2获取request三种方法 struts2里面有三种方法可以获取request,最好使用ServletRequestAware接口通过IOC机制注入Request对象. 在Actio ...
- nginx 配置301转发
学习nginx 推荐 http://www.nginx.cn/nginx-how-to 1. 设置域名解析 daijun.me 指向 234.33.22.21 2.主机234.33.22.21 ngi ...
- [置顶] iOS 名片识别代码
采用的是惠普图片识别SDK.本代码可以识别中文.代码改自 http://www.cocoachina.com/bbs/read.php?tid=123463 . 图片就不贴了,123463中的效果是可 ...
- 给想上MIT的牛学生说几句
[来信] 老师您好! 非常冒昧的来打搅您,仅仅是在学习上实在有些困惑才来向您求教一番. 我是计算机科学与技术的大一学生,我非常喜欢我自己的专业,可是学校里讲的东西太慢,太浅,所以我一般都是自学,我在自 ...