兄弟连_马剑威_JavaWeb_049_CSS尺寸

兄弟连_马剑威_JAVA基础_102_IO之字符流

IO之字符流第102 讲马剑威1、字符输出流2、字符输入流3、字节流与字符流的区别1、字符输出流字符输出流•public abstract class Writer•extends Object•implements Appendable, Closeable, Flushable•写入字符流的抽象类。

子类必须实现的方法仅有write(char[], int, int)、flush() 和close()。

但是，多数子类将重写此处定义的一些方法，以提供更高的效率和/或其他但是多数子类将重写此处定义的些方法以提供更高的效率和功能。

方法名称描述public void write(String str) throws IOException直接将字符串写入输出public void write(String str)throws IOExceptionpublic void write(char[] cbuf) throws IOException输出字符数组public abstract void close() throws IOException关闭p()ppublic abstract void flush() throws IOException刷新字符输出流1、字符输出流•与OutputStream 一样，对文件的操作使用：•FileWriter 类完成，此类的构造方法如下：方法名称描述public FileWriter(File file) throws IOException 根据File 类构造FileWriter 实例Fil Fil W it 实例public FileWriter(File file,boolean append) throws IOException 根据File 类构造FileWriter 实例，可以追加内容2、字符输入流字符输入流•public abstract class Readerextends Objectd Obj•implements Readable, Closeable•用于读取字符流的抽象类。

兄弟连_马剑威_JAVA基础_075_instanceof关键字

instanceof关键字
第75 讲
马剑威
1instanceof
、关键字
2、父类的设计法则
1、instanceof关键字
•语法格式如下：
•对象instanceof类型－－返回boolean类型值
•该语句一般用于判断一个对象是否为某个类的实例，是返回true，否返回false
1、父类的设计法则
父类的设计法则
•通过instanceof关键字，我们可以很方便的检查对象的类型，但如果一个父类的子类过多，这样的判断还是显得很繁琐，那么如何去设计一个父类呢？
过多，这样的判断还是显得很繁琐，那么如何去设计个父类呢？
•1、父类通常情况下都设计为抽象类或接口，其中优先考虑接口，如接口不能满足才考虑抽象类。

•2、一个具体的类尽可能不去继承另一个具体类，这样的好处是无需检查对象是否为
父类的对象。

谢谢Th k Thanks。

兄弟连视频教程下载地址

兄弟连iOS视频教程
兄弟连iOS学习入门C语言基础
/s/1jHsX3OM
Objective-C语言
/s/1pJThfKJ
参加活动获取LAMP+LNMP环境编译及搭建视频教程
/read-htm-tid-171938.html
兄弟连官网：
兄弟连云课堂：
兄弟连微信公众号：lampbrother
/s/1gdfjK6B
兄弟连新版视频教程前端 2 CSS （共8讲）
/s/1mg25mUc
兄弟连新版视频教程前端 2 CSS（未打包）
/s/1bnofxlt
兄弟连新版视频教程前端 3 DIV+CSS （共13讲）
兄弟连官网：
兄弟连云课堂：
兄弟连微信公众号：lampbro新版视频教程整体打包下载地址
/s/1i3AcTIt
兄弟连新版视频教程前端 3 DIV+CSS（未打包）
/s/1kTMuWQj
兄弟连新版视频教程前端 4 HTML5 （共12讲）
/s/1kTzPzd9
兄弟连张诚UI视频教程
/s/1kTjf0t5
兄弟连新版安卓bSGMM
经典版PHP视频教程
/s/1ntw82Zv
/s/1c0DfQFY
新版Linux视频教程 Linux基础知识与系统管理
/s/19glYm
兄弟连新版Linux教程 Linux网络基础
/s/1jG3n1TO
兄弟连新版Linux教程 Linux网络服务
/s/1eQrV5ke
《细说PHP》第二版光盘
/s/1nt9P3O9
明哥聊求职

兄弟连_马剑威_JavaWeb_041_CSS文本

第讲文本第41讲：CSS课程大纲•1、缩进文本•2、水平对齐•3、字间隔•4、字母间隔•5、字符转换•6、文本装饰1、缩进文本•把Web 页面上的段落的第一行缩进，这是一种最常用的文本格式化效果。

•CSS 提供了text-indent 属性，该属性可以方便地实现文本缩进。

•通过使用text-indent 属性，所有元素的第一行都可以缩进一个给定的长度，甚至该长度可以是负值。

•这个属性最常见的用途是将段落的首行缩进，下面的规则会使所有段落的首行缩进5 em：1.p {text-indent: 5em;}2、水平对齐•text-align是一个基本的属性，它会影响一个元素中的文本行互相之间的对齐方式。

它的前3 个值相当直接，不过第4 个和第5 个则略有些复杂。

•值left、right 和center 会导致元素中的文本分别左对齐、右对齐和居中。

•西方语言都是从左向右读，所有text-align 的默认值是left。

文本在左边界对齐，右边界呈锯齿状（称为“从左到右”文本）。

对于希伯来语和阿拉伯语之类的的语言，text-align 则默认为right，因为这些语言从右向左读。

不出所料，center 会使每个文本行在元素中居中。

行在元素中居中3、字间隔•word-spacing 属性可以改变字（单词）之间的标准间隔。

其默认值normal 与设置值为0 是一样的。

•word-spacing 属性接受一个正长度值或负长度值。

如果提供一个正长度值，那么字之间的间隔就会增加。

为word-spacing 设置一个负值，会把它拉近：1.p.spread {word-spacing: 30px;}4、字母间隔•letter-spacing 属性与word-spacing 的区别在于，字母间隔修改的是字符或字母之间的间隔。

•与word-spacing 属性一样，letter-spacing 属性的可取值包括所有长度。

默认关键字是normal（这与letter-spacing:0 相同）。

兄弟连_马剑威_JavaWeb_050_CSS分类

第讲分类第50讲：CSS课程大纲•1、CSS 分类属性1、CSS 分类属性•CSS 分类属性允许你控制如何显示元素，设置图像显示于另一元素中的何处，相对于其正常位置来定位元素，使用绝对值来定位元素，以及元素的可见度。

•clear设置一个元素的侧面是否允许其他的浮动元素。

•cursor规定当指向某元素之上时显示的指针类型。

•display设置是否及如何显示元素。

•Float定义元素在哪个方向浮动。

•visibility设置元素是否可见或不可见。

1、CSS 分类属性•display设置是否及如何显示元素。

•把元素显示为内联元素•p {display: inline}•把元素显示为块级元素•span•{display: block•display:block•}1、CSS 分类属性•Float定义元素在哪个方向浮动。

•带标题的图像浮动于右侧•div{•float:right;width:120px;margin:0 0 15px 20px;padding:15px;border:1px solid black;g;}•text-align:center;}•<div>img src/i/eg_cute.gif /br /•<img src="/i/eg cute.gif"/><br/>•CSS is fun!•</div>1、CSS 分类属性•Float定义元素在哪个方向浮动。

•使段落的首字母浮动于左侧•span{•float:left;•width:0.7em;;•font-size:400%;•font-family:algerian,courier;line height:80%;•line-height:80%;•}•<span>T</span>his is some text.1、CSS 分类属性•Float定义元素在哪个方向浮动。

css长度单位

1 ch<!DOCTYPE html><html lang="zh-cn"><head><meta charset="utf-8" /><title>ch_</title><style>body{background-color: deepskyblue;}</style><style>h1{margin:10px0;font-size:16px;}div{overflow:hidden;width: 10ch;background:#ccc;}</style></head><body><h1>定义一个宽度正好能装下10个0的容器：</h1><div>0000000000</div></body></html>2 cm<!DOCTYPE html><html lang="zh-cn"><head><meta charset="utf-8" /><title>cm</title><!--描述：厘米（Centimeters）。

绝对长度单位。

1in = 2.54cm = 25.4 mm = 72pt = 6pc = 96px 示例代码：div{font-size:1cm;}p{height:10cm;}--><style>body{background-color: deepskyblue;}</style><style>h1{margin:10px0;font-size:16px;}div{width:10cm;background:#eee;}p{margin:0;padding:0;line-height:150%;}</style></head><body><h1>定义一个宽度为10cm的容器：</h1><div><p>这是一个宽度为10cm的容器</p></div></body></html>3 em<!DOCTYPE html><html lang="zh-cn"><head><meta charset="utf-8" /><title>em_CSS参考手册_web前端开发参考手册系列</title><!--描述：相对长度单位。

兄弟连_马剑威_JavaWeb_043_CSS边框

第讲框第43讲：CSS边框课程大纲•1、盒子模型•2、边框的样式•3、边框的宽度•4、边框的颜色1、盒子模型2、边框的样式•样式是边框最重要的一个方面，这不是因为样式控制着边框的显示（当然，样式确实控制着边框的显示），而是因为如果没有样式，将根本没有边框。

•CSS 的border-style 属性定义了10 个不同的非inherit 样式，包括none。

•例如，您可以为把一幅图片的边框定义为outset，使之看上去像是“凸起按钮”：1.a:link img {border-style: outset;}•定义多种样式•您可以为一个边框定义多个样式，例如：p{y}1.p.aside {border-style: solid dotted dashed double;}3、边框的宽度•您可以通过border-width 属性为边框指定宽度。

•为边框指定宽度有两种方法：可以指定长度值，比如2px 或0.1em；或者使用3 个关键字之一，它们分别是thin 、medium（默认值）和thick。

1.注释：CSS 没有定义3 个关键字的具体宽度，所以一个用户代理可能把thin 、medium 和thick 分别设置为等于5px、3px 和2px，而另一个用户代理则分别设置为3px、2px 和1px。

2.所以，我们可以这样设置边框的宽度：3.p {border-style: solid; border-width: 5px;}4、边框的颜色•设置边框颜色非常简单。

CSS 使用一个简单的border-color 属性，它一次可以接受最多4 个颜色值。

•可以使用任何类型的颜色值，例如可以是命名颜色，也可以是十六进制和RGB 值：1.p { border-style: solid; border-color: blue rgb(25%,35%,45%) #909090 red; }2.如果颜色值小于4 个，值复制就会起作用。

上海兄弟连学员带你真实了解Java培训学习内容

上海兄弟连学员带你真实了解Java培训学习内容兄弟连上海Java培训官网：/对于兄弟连上海Java培训课程第一阶段学的知识，主要涉及到了对软件行业信息了解、Java的魅力和安装、变量、常量、算术、关系、逻辑、三目、ifelse、switch、while、for、for 高级、dowhile、方法、方法算法、封装的数据类型、老版本和新版本代码写法、封装、继承、多态、抽象类、接口、内部类、无名内部类、泛型、异常、自定义异常、包、常用类、数组等等。

另外，还学习了Java的重要特性，比如以下内容：第一，简单性：简单明了，易掌握;第二，面向对象：面向对象是Java语言的基础，也是Java语言的重要特性;第三，分布性：它是操作的分布和数据的分布;第四，可移植性：java程序具有系统无关的特性，可以方便的移植到网络上的不同计算机中;第五，解释型：运行程序需要解释器;第六，安全性：Java删除了类似C语言的指针和内存释放的语法，有效的避免了非法操作;第七，健壮性：程序的设计目标之一，是编写多方面的，可靠的应用程序;第八，多线程：多线程在同一时间执行多项任务;第九，高能性：java编译的字节码是在解释器中运行的，比多数的应用程序相比速度提高了;第十，动态：和C和C++更能适应发展的环境可以在动态调整库中方法和增加变量。

这一看不知不觉我也是掌握了这么多知识的人了，这是我以前想都不敢想的，如果在以前这是想都不敢想的，只是看到这些简介我都会头大，但是现在看到这些的状态是看一个会一个这都归功于在兄弟连上海Java培训的学习，是这段时间的学习让我掌握了这么多知识，让我成长了许多，同时随着对Java了解的增多，我也发现自己会的还很少，其实学习Java 的道路还很长，需要一步一个脚印去走，只有这样我才能在以后的路上越走越远。

希望自己在接下来的学习中更加认真，努力的学习，争取成为一个合格的程序员!兄弟连上海Java培训官网：/java/。

兄弟连 JavaWeb_049_CSS尺寸

第讲尺寸第49讲：CSS
课程大纲
•1、CSS 尺寸属性
•2、单位
1、CSS 尺寸属性
•CSS 尺寸属性允许你控制元素的高度和宽度。

同样，还允许你增加行间距。

•height 设置元素的高度。

•line-height 设置行高。

g
•max-height 设置元素的最大高度。

•max-width 设置元素的最大宽度。

•min-height 设置元素的最小高度。

g设置元素的最小高度
•min-width 设置元素的最小宽度。

•width 设置元素的宽度。

2、单位单描
单位描述
em 1em 等于当前的字体尺寸。

2em 等于当前字体尺寸的两倍。

例如如果某元素以12pt显示那么2em
例如，如果某元素以12pt 显示，那么2em 是24pt。

在CSS 中，em 是非常有用的单位，因为它可以自动适应用户所使用的字体。

ex一个ex 是一个字体的x-height。

(x-height 通常是字体尺寸的一半。

) cm厘米
mm毫米
%百分比
in英寸
pt磅(1 pt 等于1/72 英寸)
12(1pc12
pc12 点活字(1 pc 等于12 点)
px像素(计算机屏幕上的一个点)
THANK
YOU!
微信号：weige-java
扫一扫，关注威哥微信公众平台。

CSS的长度单位适配方案

CSS旳长度单位适配方案序言一般而言，我们用CSS设置字体大小和元素长宽是这样旳：.name {font-size: 16px;width: 100px;}(由于字体大小和元素长宽旳原理同样，下面统一讨论字体。

)本来一切好好旳，但到了不一样旳屏幕上效果差异就很大了。

假设你旳设计稿是按照iphone6旳尺寸来标注，那在iphone6 plus上，由于你旳字体还是同样大，因此在iphone6 plus上看起来会小一点。

假如屏幕尺寸再大，则会再小，效果和UI设计旳看起来就不太同样了。

尤其是某些固定尺寸旳元素，看起来就会很奇怪。

原始旳做法更好旳设计是，在iphone6 plus上把iphone6旳设计放大。

例如6旳屏幕宽度是375，字体大小为16，而6p旳宽度为414，那字体就应当是414/375*16=17.6px。

也就是根据两者之间旳比例来放大字体。

然而，屏幕并不只有6和6p，也许还要适配其他不一样尺寸旳屏幕。

并且假如每种适配都需要重新修改字体样式旳话，工作量就太大了。

当然，最简朴旳做法就是在head里面设置initial-scale，根据不一样屏幕来决定缩放旳值。

不过，这种做法有个不好旳地方，就是它自身是一种放大功能，字体和图片被放大之后会变模糊，对于追求比较高旳前端页面来说也许难以接受。

尚有另一种方面，IE并不能缩放px字体旳大小。

假如在IE上进行了缩放，那字体还是那么大。

三种不一样旳单位接下来简介三种不一样旳长度单位(CSS Units)。

pxpx，就是pixels。

翻译为像素并不十分精确，也许翻译为点更好，不过已经有另一种单位pt(points)，因此，也只能继续翻译为像素了。

这里旳px不一样于一般旳像素，它旳特性就是在不一样旳设备上代表旳大小不一样。

在低清屏上，1px就代表1像素，而在高清屏上，例如iphone 6上则代表2个像素，而在iphone6 plus上则代表3个像素，由于6p是3倍旳高清屏。

兄弟连_马剑威_JavaWeb_044_CSS外边距

第讲外第44讲：CSS外边距课程大纲•1、CSS 外边距•2、CSS margin 属性•3、值复制•4、单边外边距属性1、CSS 外边距•围绕在元素边框的空白区域是外边距。

设置外边距会在元素外创建额外的“空白”。

•设置外边距的最简单的方法就是使用margin 属性，这个属性接受任何长度单位、百分数值甚至负值。

2、CSS margin 属性•设置外边距的最简单的方法就是使用margin 属性。

•margin 属性接受任何长度单位，可以是像素、英寸、毫米或em。

g•margin 可以设置为auto。

更常见的做法是为外边距设置长度值。

•下面的例子为h1 元素的四个边分别定义了不同的外边距：•h1 {margin : 10px 0px 15px 5px;}这些值的顺序是从上外边距(p)开始围着元素顺时针旋转的•(top) 开始围着元素顺时针旋转的：margin: top right bottom left2、CSS margin 属性另外，还可以为margin 设置一个百分比数值：p {margin : 10%;}•百分数是相对于父元素的width 计算的。

上面这个例子为p 元素设置的外边距是其父p元素的width 的10%。

•margin 的默认值是0，所以如果没有为margin 声明一个值，就不会出现外边距。

但是，在实际中，浏览器对许多元素已经提供了预定的样式，外边距也不例外。

例如，在支持CSS 的浏览器中，外边距会在每个段落元素的上面和下面生成“空行”。

因此，CSS的浏览器中外边距会在每个段落元素的上面和下面生成“空行”因此如果没有为p 元素声明外边距，浏览器可能会自己应用一个外边距。

当然，只要你特别作了声明，就会覆盖默认样式。

3、值复制•在前面我们提到过值复制。

下面我们为您讲解如何使用值复制。

•有时，我们会输入一些重复的值：p{g}1.p {margin: 0.5em 1em 0.5em 1em;}2.通过值复制，您可以不必重复地键入这对数字。

最全的CSS尺寸单位介绍

最全的CSS尺寸单位介绍前端开发过程中，尺寸单位是我们必须用到的，下面我们对css中常见的几种尺寸单位px,em,rem,rpx进行逐一介绍在这之前，需要先对几个概念进行普及介绍基本概念（以下概念读起来可能有些晦涩，如果看不懂也没关系）像素它不是自然界的物理长度，指基本原色素及其灰度的基本编码。

css中的像素只是一个抽象的单位，在不同的设备或不同的环境中，css中的1px所代表的设备物理像素是不同的。

在为桌面浏览器设计的网页中，我们无需对这个津津计较，但在移动设备上，必须弄明白这点。

在早先的移动设备中，屏幕像素密度都比较低，如iphone3，它的分辨率为320x480，在iphone3上，一个css像素确实是等于一个屏幕物理像素的。

后来随着技术的发展，移动设备的屏幕像素密度越来越高，从iphone4开始，苹果公司便推出了所谓的Retina屏，分辨率提高了一倍，变成640x960，但屏幕尺寸却没变化，这就意味着同样大小的屏幕上，像素却多了一倍，这时，一个css像素是等于两个物理像素的。

其他品牌的移动设备也是这个道理。

物理像素它是显示器（电脑、手机屏幕）最小的物理显示单位，物理像素指的是显示器上最小的点。

物理像素的大小取决于屏幕。

是一个无法改变的属性。

设备独立像素我上一张图，你就会理解什么是设备独立像素就是我们开发过程中使用的css中的px设备像素比（device pixel radio）设备像素比 = 物理像素 / 设备独立像素，单位是dpr！（device pixel radio）Retina屏幕所谓“Retina”是一种显示标准，是把更多的像素点压缩至一块屏幕里，从而达到更高的分辨率并提高屏幕显示的细腻程度。

也被称为视网膜显示屏——百度百科因为Retina屏幕的出现，在pc端默认情况下，css中的1px等于1物理像素，但在移动端1px不一定等于1物理像素，比如说iPhone 的设备独立像素是375 *667，因为它使用了Retina屏幕，他的dpr 是2，所以iPhone 6 的物理像素为 750 *1334在不同的屏幕上(普通屏幕vs retina屏幕)，css中1px所呈现的大小(物理尺寸)是一致的，不同的是1px所对应的物理像素个数是不一致的。

关于CSS中的字体尺寸设置

关于CSS 中的字体尺寸设置写在前面上一篇文章如何做好移动端的响应式设计：Viewport 控制讨论到了CSS 像素，于是我决定研究一下如何用不同的方式来在CSS 中设定字体大小。

常用单位在CSS 中可以用很多不同的方式来设定字体的尺寸。

一般来说，这些单位被分成两大类：绝对单位(absolute)和相对单位(relative)。

• 绝对单位在大多数情况下是相对于某些实际量度而言的固定值，即是说它们一旦设定，就不会因为其他元素的字体尺寸变化而变化。

• 相对单位没有一个固定的度量值，而是由父元素尺寸来决定的相对值，它们的尺寸会根据与其相关的元素改变而改变。

下面是对这些单位的一个简单整理：单位类型描述pxAbsolute 1个Viewport 像素 ptAbsolute 1pt = 1/72英寸 pcAbsolute 1pc = 12pt %Relative 相对于父元素的字体尺寸 emRelative 相对于父元素的字体尺寸 rem Relative (即root em) 相对于html 标签的字体尺寸 keyword Relative xx-small, x-small, small, medium, large, x-large, xx-largevwRelative 相当于Viewport 宽度的1/100 vhRelative 相当于Viewport 高度的1/100 vminRelative 相当于Viewport 高宽中长度相对较小的1/100 vmax Relative 相当于Viewport 高宽中长度相对较大的1/100这里主要关注这几个单位：px 、pt 、%、em 、rem 和vw 。

它们之间有什么区别？从概念上很难理解这些单位之间的差别，所以下面用一些实例来说明。

例1. 默认设定当你不设定字体尺寸时，HTML会提供一个默认的尺寸设定。

大多数浏览器中<html>和<body>标签中的默认字体尺寸是100%，没有概念？看这个等式：100% = 1em = 1rem = 16px = 12pt还是不懂？那就换个说法，比如说你给一个<p>设置字体尺寸为100%，给另一个<p>设置为16px，在屏幕上看到的这两个<p>中的字体大小是一样的，下图列出了用几个不同单位设置的字体尺寸，可以看出是一样大的：例2. 绝对与相对改变<html>的字体尺寸可以很明显的看出绝对单位和相对单位的差别。

浅谈CSS中的尺寸单位

浅谈CSS中的尺⼨单位浏览器的兼容性越来越好，移动端基本是清⼀⾊的webkit，经常会⽤到css的不同尺⼨/长度单位，这⾥做个整理。

概览绝对单位px: Pixel 像素pt: Points 磅pc: Picas 派卡in: Inches 英⼨mm: Millimeter 毫⽶cm: Centimeter 厘⽶q: Quarter millimeters 1/4毫⽶相对单位%: 百分⽐em: Element meter 根据⽂档字体计算尺⼨rem: Root element meter 根据根⽂档（ body/html ）字体计算尺⼨ex: ⽂档字符“x”的⾼度ch: ⽂档数字“0”的的宽度vh: View height 可视范围⾼度vw: View width 可视范围宽度vmin: View min 可视范围的宽度或⾼度中较⼩的那个尺⼨vmax: View max 可视范围的宽度或⾼度中较⼤的那个尺⼨运算calc: 四则运算实例：h1 {width: calc(100% - 10px + 2rem);}单位⽐例1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px详细绝对单位px - Pixel 像素像素 px 相对于设备显⽰器屏幕分辨率⽽⾔。

div { font-size: 12px }p { text-indent: 24px }pt Points 磅1 pt = 1/72 英⼨div { font-size: 10pt }p { height: 100pt }pc Picas 派卡⼗⼆点活字（印刷中使⽤的），相当于我国新四号铅字的尺⼨。

div { font-size: 10pc }p { height: 10pc }in Inches 英⼨div { font-size: 10in }p { height: 10in }mm Millimeter 毫⽶div { font-size: 10mm }p { height: 10mm }cm Centimeter 厘⽶div { font-size: 10cm }p { height: 10cm }q Quarter millimeters 1/4毫⽶div { font-size: 20q }p { height: 100q }相对单位% 百分⽐相对于⽗元素宽度<body><div class="parent"><div class="children"></div></div></body><style>.parent { width: 100px }.children { width: 66.6% }/* children的宽度为 66.6px */</style>em Element meter 根据⽂档计算尺⼨相对于当前⽂档对象内⽂本的字体尺⼨⽽⾔，若未指定字体⼤⼩则继承⾃上级元素，以此类推，直⾄ body，若 body 未指定则为浏览器默认⼤⼩。

css media 常用尺寸

css media 常用尺寸CSS Media查询是一种在网页设计中常用的技术，通过它可以根据不同的设备尺寸和特性来应用不同的样式。

在这篇文章中，我将介绍一些常用的CSS Media查询尺寸，并解释它们的作用和用法。

1. 响应式网页设计在现代的网页设计中，响应式设计已经成为一种标配。

响应式设计的目的是使网页能够在不同的设备上以最佳的方式展示，包括桌面电脑、平板电脑和手机等。

为了实现这一目标，我们可以使用CSS Media查询来根据不同的设备尺寸和屏幕宽度应用不同的样式。

2. 移动设备尺寸在移动设备上浏览网页已经成为现代人的常态，因此我们需要关注移动设备的尺寸。

常见的移动设备尺寸有320px、375px和414px等。

我们可以使用@media查询来针对这些尺寸应用不同的样式，以确保网页在不同的移动设备上都能够正常显示。

3. 平板电脑尺寸平板电脑作为一种介于手机和电脑之间的设备，其尺寸也需要我们考虑。

常见的平板电脑尺寸有768px和1024px等。

通过使用@media 查询，我们可以根据平板电脑的尺寸来应用不同的样式，以使网页在平板电脑上有更好的展示效果。

4. 桌面电脑尺寸桌面电脑是最常见的网页浏览设备，因此我们也需要关注桌面电脑的尺寸。

常见的桌面电脑尺寸有1280px、1440px和1920px等。

通过使用@media查询，我们可以根据桌面电脑的尺寸来应用不同的样式，以使网页在不同的桌面电脑上都能够良好地显示。

5. Retina屏幕Retina屏幕是苹果公司开发的一种高分辨率显示屏，具有更高的像素密度。

为了在Retina屏幕上展示更清晰的图片和文字，我们可以使用@media查询来应用高分辨率的样式。

通过使用@media查询和CSS的background-size属性，我们可以实现在Retina屏幕上显示高分辨率的图片。

6. 打印样式除了考虑不同设备的尺寸外，我们还可以使用@media查询来应用打印样式。

css参数

六、 DW4中CSS属性详解在Dreamweaver4的CSS样式里包含了W3C规范定义的所有CSS1的属性，Dreamweaver4把这些属性分为Type（类型）、Background（背景）、Block（块）、Box（盒子）、Border（边框）、 List（列表）、Positioning（定位）、Extensions （扩展）八个部分，如下图，下面我们分别详细讲解。

1. Type（类型）Type面板主要是对文字的字体，大小，颜色，效果等基本样式进行设置。

设置时，我们只对要改变的属性进行设置，没有必要改变的属性就空着。

注意：属性名带*号的是指样式效果不能在编辑文档时显示，要用浏览器打开才能看到效果。

Font：设置字体系列。

什么叫字体系列呢？是指对文字设定几个字体，当遇到第一个字体不能显示的文字时会自动用系列中的第二个字体或后面的字体显示。

相对应的CSS属性是”font-family”。

注意：Dreamweaver4已经内置设定了6个系列的英文字体，一般英文字体我们用“Verdana, Arial, Helvetica, sans-serif”这个系列比较好看。

如果不用这些字体系列，你就需要自己编辑字体系列，你可以通过下拉框最下面的“Edit Font List”来创建新的字体系列，也可以直接手动在下拉框里写字体名，字体之间用逗号隔开。

中文网页默认字体是宋体，一般就空着不要选取任何字体。

Size：定义文字的大小。

你可以通过选取数字和度量单位来选择具体的字体大小，或者你也可以选择一个相对的字体大小。

最好使用Pixels作为单位，这样不会在浏览器中文本变形。

一般小字体用比较标准的12px。

相对应的CSS属性是”font-size”。

注意：CSS中长度的单位分绝对长度单位和相对长度单位，一般我们常用的绝对长度单位有：px：（象素）根据显示器的分辨率来确定长度。

pt：（字号）根据windows系统定义的字号大小来确定长度。

CSS的长度单位

CSS的长度单位(V客学院知识分享) 在CSS属性中有时候需要设置一些长度值，比如width属性用于设置元素的宽度。

其中在设置width属性值的时候我们需要给其加上单位标识符px、cm等。

CSS规定了两种类型的长度单位，一种是绝对单位，另一种是与其他属性挂钩的相对单位。

1、绝对单位
绝对单位指的是cm、mm这类现实生活的度量单位，CSS支持五种绝对单位in英尺、cm厘米、mm毫米、pt磅、pc pica。

2、相对单位
相对长度需要依赖于其他类型的单位，它的规定和使用更复杂。

常见的相对单位有：em 与元素字号挂钩，ex与元素字体的“x高度”挂钩，rem与根元素的字号挂钩，px CSS像素，%另一属性的值得百分比。

其中与字号挂钩的相对单位em和像素单位px运用较常见。

首先我们来看看em，em相对于当前元素的字体大小，比如在CSS样式中我们设置p标签font-size:20pt;height:2em，那么这里面的height的属性值实际上的数值是字号的两倍。

而像素一般是指相对于显示器上可寻址的最小单位。

我们在CSS中，一条样式是可以混合多种单位，包括混合使用绝对单位和相对单位。

当然使用绝对单位的前提是我们能预先知道内容的呈现方式，但相对定位更灵活、更容易管理，而且我们开发基本都是处于虚拟世界之中。

CSS长度单位参考

CSS长度单位参考(教材：Web编程基础P.68)在CSS样式表中，我们经常会看到pt，px，em，ex，in等这类长度单位。

它们各是什么意思，有什么区别呢？在CSS样式表中，长度单位分两种：▪相对长度单位，如px, em等▪绝对长度单位，如pt,mm等也谈px和pt的区别经常看到有人拿px和pt比较，主要是为了争辩在确定字体大小(font-size)或其它CSS 属性大小时，用什么样的CSS长度单位更加好。

有人说，用pt更好，因为pt是绝对长度单位，不会因为屏幕分辨率大小，或者其它因素而改变。

我去做了一个测试，写了这样一个HTML例子。

代码如下：<html><head><title>CSS单位长度区别 - px和pt的区别</title></head><body ><p style = "font-size:20pt;">Font-size is 20pt</p><p style = "font-size:20px;">Font-size is 20px</p></body></html>点击浏览文件我将我的显示器分别调到1024*768和800*600的分辨率(指screen resolution)。

不管是用pt还是用px设置的字体，都随着分辨率变化而变化。

(我使用的浏览器是IE6，其它浏览器上尚未测试过。

)我又写了另外一个HTML例子，测试一下cm(厘米)。

代码如下：<html><head><title>CSS长度单位的区别 - pt,px和cm的区别</title></head> <body >以下div宽度300pt，高度30pt： <br><div style = "width:300pt;height:30pt;border:1px solid blue;"></div>以下div宽度300px，高度30px：<br><div style = "width:300px;height:30px;border:1px solid blue;"></div>以下div宽度10cm，高度3cm： <br><div style = "width:10cm;height:3cm;border:1px solid blue;"></div></body></html>点击浏览文件结果是，cm(厘米)也是随着显示器分辨率变化而变化的。