HTML & CSS设计与构建网站

出版社:清华大学出版社
出版日期:2013-1
ISBN:9787302311034
作者:[美] Jon Duckett
页数:479页

作者简介

欢迎您选择一种更高效的学习HTML和CSS的方式。不管您设计和建立新网站，还是想更好地控制现有网站，都可以在《HTML & CSS 设计与构建网站》一书的指导下创建出用户友好、令用户赏心悦目的Web内容。我们知道，编码是一项令人望而生畏的工作，而本书却采用有别于许多传统编程书籍的新颖编排方式，将使您收到事半功倍的学习效果。

每一页都在短小精悍的示例代码的引导下，简明直观、直截了当地阐述一个新主题。本书还提供关于如何组织和设计网页的实用信息，以便帮助您创建充满魅力、易于使用的网站。学习本书不要求您具有任何经验！

主要内容

• 编写HTML5和CSS3代码

• 确定网页和站点的结构

• 准备图像、音频和视频

• 控制版式和布局

在线支持：

http://www.htmlandcssbook.com

• 下载示例代码

• 观看视频演示

• 使用附赠的教程参考工具

书籍目录

目 录

前言     v

第1章　结构 1

第2章　文本 29

第3章　列表 51

第4章　链接 63

第5章　图像 83

第6章　表格 115

第7章　表单 133

第8章　其他标记 165

第9章　Flash、视频和音频 189

第10章CSS简介 215

第11章颜色 235

第12章文本 253

第13章盒子 289

第14章列表、表格和表单 319

第15章布局 347

第16章图像 395

第17章HTML5布局 417

第18章建站过程和设计方法 441

第19章实用信息 465

编辑推荐

《HTML & CSS设计与构建网站》由清华大学出版社出版。

内容概要

作者介绍：

Jon Duckett近14年来一直从事网站设计和构建工作。Jon曾加盟小公司，也曾供职于跨国集团。Jon迄今已撰写了十多本介绍Web设计、编程、可用性和可访问性的书籍。

读者赞誉

“本书全面精细地讲解HTML/CSS基础知识，堪称读者的良师益友。”

——Ed Rhodes

“本书的编排极其考究精美，讲解清晰，通俗易懂。”

——Mike Wallace

“两星期前买了本书，迄今已从头到尾品读了一遍，如醍醐灌我顶，受益匪浅啊！”

——jemartti

媒体推荐

“本书令人赏心悦目，精当明了……可帮助读者透彻地理解HTML技术。”

——.net, June 2012

“布局新颖，给人耳目一新之感。全面超越了那些呆板的技术书籍，堪称精品。”

——Computer Arts, June 2012

名人推荐

“本书令人赏心悦目，精当明了……可帮助读者透彻地理解HTML技术。” ——net，June2012 “布局新颖，给人耳目一新之感。全面超越了那些呆板的技术书籍，堪称精品。” ——ComputerAns，June2012

章节摘录

版权页：   插图：    你经常会看到元素使用另外两个特性来指定它的大小。 这个特性以像素为单位来指定图像的高度。 这个特性以像素为单位来指定图像的宽度。 图像往往比构成页面中的其余HTML代码耗费更多的加载时间。所以，一种好的解决办法是事先指定图像的大小，这样浏览器就可以为正在加载的图像留出合适的空间余量，同时继续显示页面上的其余文本。 相对于采用HTML，越来越多的人采用CSS来指定图像的大小——有关内容详见本书第398～399页。 可以使用多个元素来指定不同格式的视频。 由于iPad上存在的一个bug，应该将MP4视频作为首选格式，否则视频可能无法播放。 该特性用于指定视频的路径。 需要使用该特性来告诉浏览器视频的格式，不然它会先加载一些视频，看看是否可以播放该文件（这会耗费时间并占用带宽）。

 HTML & CSS设计与构建网站下载 精选章节试读 更多精彩书评


发布书评

　
　

精彩书评 (总计7条)

  •     ◉HTML1、结构网页使用HTML HyperText Markup Language 来描述页面结构超文本标记语言允许对文本建立链接，允许对文本进行标记网页开头都有一个DOCTYPE 文档类型 声明，告诉浏览器此页使用的HTML版本在HTML中添加注释使用<!—— 注释文本 ——>HTML使用元素 <p>paragraph</p> 来描述页面内容的结构信息元素由起始标签 <p> 、结束标签 </p> 和其间内容组成HTML使用属性 <p lang=“en-us”> 来描述元素内容的附加信息属性由属性名称 lang 和属性值 en-us 组成HTML具有白色空间折叠特性，连续空格或换行都会显示为一个空格<html>用来描述整个页面，<head>用来描述页面首部，<body>用来描述页面主体添加页面标题使用<title>元素，元素位于<head>元素中添加页面信息使用<meta />元素，元素位于<head>元素中－name=description｜keywords｜robotscontent=———｜—，—，—｜noindex/nofollow－http-equiv=author｜pragma｜expirescontent=———｜no-cache｜Fri，04 Apr 2015 11:11:11GMT2、文本结构化标记用来描述文本结构信息－<h6>标题 <p>段落－<b>粗体 <i>斜体－<s>删除线 <u>下划线－<sup>上标 <sub>下标－<br />换行符 <hr />水平线语义化标记用来描述文本语义信息－<abbr >词汇缩写title＝“” <address>联系详情－<strong>着重强调 <em>一般强调－<del>删除 <ins>插入－<blockquote>长引用 <q>短引用 cite＝“url”－<cite>引文 <dfn>定义3、列表有序列表 <ol>－列表项目 <li>无序列表 <ul>－列表项目 <li>定义列表 <dl>－定义术语 <dt>－定义描述 <dd>4、链接添加链接使用<a>元素<a>元素通过href属性指明链接跳转页面，通过target属性指明链接打开方式链接文本尽量明确具体href属性－指向其他网站 href＝“绝对url”－指向同一网站其他页面 href＝“相对url”－指向当前页面特定位置 href＝“＃id值”－指向其他页面特定位置 href＝“url/＃id值”－指向email地址 href＝“mailto：email”target属性－在新窗口中打开链接 target＝“_blank”5、图像添加图像使用 <img />元素<img />元素通过src属性指明图像来源，通过alt属性描述图像内容创建图像基本原则－使用正确的格式来保存图像 JPEG：多色 GIF：动画 PNG：透明－使用正确的大小来保存图像 使用像素衡量图像／使用缩放或裁剪匹配页面为图像添加说明使用<figure>元素<figure><img /><br /><figcaption>图像说明文本</figcaption></figure>6、表格添加表格使用<table>元素表格按照行的顺序逐行绘制，行用<tr>元素表示表格数据用<td>元素表示表格标题用<th>元素表示，可以通过scope属性表明标题是行标题 row 还是列标题 col 如需要跨行或跨列，可以使用rowspan属性或colspan属性，属性值为所跨的行数或列数长表格可以用<thead>表示第一行，用<tbody>表示主体内容，用<tfoot>表示最后一行7、表单添加表单使用<form>元素，表单控件位于<form>元素中表单中的信息以“名称／值”的形式进行发送<form>元素通过action属性指明接收表单信息的web服务器，通过method属性表明提交表单是只为了检索信息 get 还是为了添加或删除信息 post 表单控件类型－添加文本<input />type=text/password/email/url/searchname＝maxlength= 最长字符placeholder= 占位文本required= 表单验证<textarea> name=－进行选择<input />type=radio/checkboxname=value=checked= 选中选项<select> <option>name= value＝(size= ) 选项显示数 selected＝ 选中选项(multiple= ) 多选－提交表单<input />type=submitname=value=<input />type=imagesrc=width=height=－上传文件/日期<input />type=file/datename=－隐藏控件<input />type=hiddenname=value=为表单添加按钮使用<button>元素，可在其间结合使用文本和图像为表单添加说明使用<label>元素<label>Age<input type=“text” name=“age” /></label><input id=“m” type=“radio” name=“gender” value=“m” /><label for=“m”>Male</label>为表单添加组合使用<fieldset>元素<fieldset><legend>控件组标题</legend>表单控件表单控件</fieldset>8、其他标记每个HTML元素都可以附带id属性，用来对某一个元素进行标识每个HTML元素都可以附带class属性，用来对某一类元素进行标识－如果某一个元素属于不同类，可以用空格将类名隔开块级元素在浏览器显示中总是另起一行，如<h1>、<p>、<ul>内联元素在浏览器显示中总是与邻近元素出现在同一行内，如<a>、<b>、<img><div>元素将文本和元素集中在一个块级元素中<span>元素将文本和元素集中在一个内联元素中添加内联框架使用<iframe>元素，内联框架在页面上划出一定区域用来显示其他页面<iframe>元素通过src属性指明显示页面地址，通过width和height属性指明框架宽高，通过seamless属性指明框架是否需要滚动条，添加此属性则表明不需滚动条有些字符用于编写HTML代码而成为保留字符，需要使用转义字符来实现显示－&lt &gt &amp &times &divide－&quot &lsquo &rdquo－&cent &pound &yen &euro－&copy &reg &trade9、Flash、视频和音频添加Flash使用JavaScript脚本，添加视频使用<video>元素，添加音频使用<audio>元素<video> <audio>src srcposter 图像显示 －－width,height －－controls controls 播放控件preload none/auto/metadata preload 预加载autoplay autoplay 自动播放loop loop 重新播放添加多个视频源／音频源使用<source />元素替代src属性－<source src=“video/文件名.mp4” type=‘video/mp4;codecs=“ ”’ />－<source src=“audio/文件名.mp3” type=“video/mp3” />◉CSS10、CSS简介网页使用CSS Cascading Style Sheet 来控制页面呈现层叠样式表设想在元素周围有一个看不见的盒子，可通过规则来控制一条CSS规则包含两个部分：选择器和声明，选择器指明要应用规则的元素，声明指明这些元素的表现和布局－h1，p｛color：yellow；｝－同一条规则可以应用在多个元素上，其间用逗号隔开－一条声明包含两个部分：属性和值，两者用冒号隔开－任意一条声明内可以指定多个属性，其间用分号隔开在CSS中添加注释使用<／* 注释文本 *／>在页面中添加CSS规则可使用外部CSS文件（推荐使用），也可使用内部CSS代码－外部 <link href= type=“text/css” rel=“stylesheet” />－内部 <style type=“text/css”> ########### </style>CSS选择器类型－基本选择器通用选择器＊｛｝匹配所有元素类型选择器p｛｝匹配某一类型元素类选择器.class｛｝匹配class属性相同的元素ID选择器＃id｛｝匹配id属性相同的元素子元素选择器p>a｛｝匹配指定元素的直接子元素后代选择器p a｛｝匹配指定元素的后代元素相邻兄弟选择器h1+p｛｝匹配指定元素的下一个元素普通兄弟选择器h1～p｛｝匹配指定元素的下一类元素－特性选择器简单选择器p[class]匹配一种具有特定属性的元素精确选择器p[class＝“css”]匹配一个具有特定属性值的元素，该属性值唯一部分选择器p[class～＝“css”]匹配一个具有特定属性值的元素，该属性值不唯一开头选择器p[attr^=“c”]匹配一个具有特定属性值的元素，该属性值以某字符串开头包含选择器p[attr*=“css”]匹配一个具有特定属性值的元素，该属性值包含某字符串结尾选择器p[attr$=“s”]匹配一个具有特定属性值的元素，该属性值以某字符串结尾伪元素 就像在代码中加入了额外的元素－首字母 :first-letter｛｝／首行文本 :first-line｛｝伪类 就像是一个类特性的额外的值－未访链接 :link｛｝／已访链接 :visited｛｝－悬停 :hover｛｝／操作 :active｛｝/获取焦点 :focus｛｝CSS优先级原则－就近性原则：如果两个选择器完全相同，那么后出现的选择器优先级更高－具体性原则：如果一个选择器比其他选择器更加具体，那么具体的选择器优先级更高－重要性原则：如果在任意属性值后添加 ！important ，那么这条规则更重要11、颜色指定颜色方式－RGB值 rgba(90,90,90,0.5) 红 绿 蓝 不透明－HSL值 hsla(0,0%,78%,0.5) 色调 饱和度|灰色 亮度|黑色 不透明－十六进制编码 #eeeeee 红 绿 蓝－颜色名称 DarkCyan为使文本清晰易读，确保前景色 color 和背景色 background-color 之间有足够对比度－白色背景－灰黑色文本－黑色背景－灰白色文本12、文本文字属性－字体系列 font-familyGeorgia,Times,serif 衬线字体 适用于长文本Arial,Verdana,sans-serif 无衬线字体 适用于短文本“Courier New”,Courier,monospace 等宽字体 适用于代码显示“Comic Sans MS”,cursive 草书字体 适用于手写风格Impact,fantasy 虚幻字体 适用于装饰－字体大小 font-size12px 像素200% 百分数 默认16px1.3em EM值 1em相当于1个字母m的宽度－字体粗细 font-weightnormal 常规bold 粗体－字体样式 font-stylenormal 常规italic 斜体oblique 倾斜文本属性－文本切换 text-transformuppercase 大写lowercase 小写capitalize 单词首字母大写－文本装饰 text-decorationnone 无underline 下划线overline 上划线line-through 穿越线blink 闪烁－文本对齐 text-alignleft 左对齐right 右对齐center 居中对齐justify 两端对齐－垂直对齐 vertical-align 用于内联元素（如<img>）与文本的垂直对齐top/text-top 顶部对齐middle 中间对齐baseline 基线对齐bottom/text-bottom 底部对齐－文本缩进 text-indent20px－文本投影 text-shadow1px 1px 0px #111111水平偏移 垂直偏移 模糊距离 颜色－文本间距行间距 line-height 1.4em单词间距 word-spacing 0.25em字母间距 letter-spacing 0.1em13、盒子CSS采用盒子模型来处理每个HTML元素控制盒子大小－盒子宽度 width 宽度限制 min-width/max-width－盒子高度 height 高度限制 min-height/max-height－内容溢出 overflow：hidden 隐藏/scroll 滚动控制盒子边框、内边距、外边距－边框 border：2px dotted #000000边框宽度 border-width：2px｜thin/midium/thick｜2px 1px｜2px 1px 3px 2px－border-top-width／border-right-width／border-bottom-width／border-left-width边框样式 border-style：solid 实线/dotted 方形点线/dashed 虚线/double 双实线/groove 雕入/ridge 浮出/inset 嵌入/outset 凸出/hidden 隐藏/none 无－border-top-style／border-right-style／border-bottom-style／border-left-style边框图像 border-image：url(“images/dots.gif”) 11 11 11 11 stretch/repeat/round图像URL 切割位置 伸展/重复/自适应重复边框颜色 border-color：#000000｜＃000000 #111111 #222222 #333333－border-top-color／border-right-color／border-bottom-color／border-left-color 边框圆角border-radius：2px｜2px 1px｜2px 1px 3px 2px｜1em 2em 1em 2em/2em 1em 2em 1em－border-top/bottom-right/left-radius：2px 1px－内边距 padding：2px｜2px 1px｜2px 1px 3px 2pxpadding-top／padding-right／padding-bottom／padding-left－外边距 margin：2px｜2px 1px｜2px 1px 3px 2pxmargin-top／margin-right／margin-bottom／margin-left－如果为一个盒子指定了宽高，那么盒子的边框、内边距、外边距会增加到它的宽高上－如果想为一个盒子在包含此盒的外部元素内居中显示，指定盒子宽度并将其左右两侧的外边距设置为auto，并在包含此盒的元素中添加text-align属性，设定其值为center控制盒子阴影－盒子投影 box-shadow(inset) 1px 1px 2px 2px #111111（内阴影）水平偏移 垂直偏移 模糊距离 阴影扩展 颜色－显示／隐藏盒子盒子显示 visibility－hidden 使盒子隐藏，并在该盒子位置留下空白/ visible 显示－li｛display：inline；margin-right：10px；｝li.hide｛visibility：hidden；｝元素显示 display 内联元素与块级元素转换 －inline 使块级元素表现得像内联元素－block 使内联元素表现得像块级元素－inline-block 使块级元素像内联元素那样浮动并保持其他块级元素特征－none 使元素隐藏，就像没有这个元素一样－li｛display：inline；margin-right：10px；｝li.hide｛display：none；｝14、列表、表格和表单列表属性－列表标记 list-style：inside circle列表标记类型 list-style-type：(ul)none/disc/circle/square ol)decimal/decimal-leading-zero/upper-alpha/lower-alpha/upper-roman/lower-roman列表标记图像 list-style-image:(ul)url(“images/star.png”) 列表标记位置 list-style-position：outside/inside表格属性－表格宽度 table｛width:600px;｝－空单元格 table｛empty-cells:show/hide;｝－单元格间距 th，td｛border-spacing:5px｜5px 15px;｝－单元格合并 th，td｛border-collapse:collapse/separate; ｝－定义表格样式技巧设置单元格内边距 th，td｛padding:7px 10px 10px 10px;｝区分标题－粗体大写显示 th｛text-transform:uppercase;letter-spacing:0.1em;font-size:90%;｝－添加背景色或下划线 th｛border-bottom:2px solid #111;border-top:1px solid #999;｝交替改变表格行的背景色 tr.class｛background-color:#efefef;｝悬停高亮显示当前表格行 tr:hover｛background-color:#c3e6e5;｝向右对齐数字 .number｛text-align:right;｝表单属性－定义单行文本框样式input｛font-size:120%;color:#5a5854;back-ground-color:#f2f2f2;border:1px solid #bdbdbd;border-radius:5px;padding:5px 5px 5px 30px;background-repeat:no-repeat;background-position:8px 9px;display:block;margin-bottom:10px;｝input:focus,input:hover｛back-ground-color:#ffffff;border:1px solid #b1e1e4;｝input#email｛background-image:url(“images/email.png”);｝input#password｛background-image:url(“images/password.png”);｝－定义提交按钮样式input#submit｛color:#444444;text-shadow:0px 1px 1px #ffffff;border-bottom:2px solid #b2b2b2;background-color:#b9e4e3;｝input#submit:hover｛color:#333333;border:1px solid #a4a4a4;border-top:2px solid #b2b2b2;｝光标属性－光标类型 cursor：auto/default/crosshair/pointer/move/text/wait/help/url(“cursor.gif”)15、布局控制元素的位置 position－普通流 static 每个块级元素都换行显示－相对定位 relative 以其在普通流中所处的位置进行移动 位移属性 top/bottom:10px｜right/left:10px－绝对定位 absolute 脱离普通流，不影响周围元素的位置，随着页面的滚动而移动－固定定位 fixed 脱离普通流，不影响周围元素的位置，不随着页面的滚动而移动位移属性 top/bottom:0px｜right/left:0px控制元素的层次 z-index－当使用相对定位、绝对定位或固定定位时，元素可能重叠，后出现元素会位于先出现元素上面－可使用z-index属性控制元素层次，该属性值是一个数字，数字越大，元素属性越靠前控制元素的浮动 float－浮动 float：left/right 将元素定位到其包含元素的最左侧或最右侧－清除浮动 clear：left/right /both/none 表明该元素左侧或右侧不允许浮动元素出现－如果一个包含元素只包含浮动元素，其高度可能会被看成0像素，需在其样式中添加两条CSS规则 overflow:auto｜width:100%－使用浮动将元素并排p｛width:230px;float:left;margin:5px;padding:5px;background-color:#efefef;｝p.clear｛clear:left;｝－使用浮动创建多列式布局.col1,.col2,.col3｛width:300px;float:left;margin;｝理解页面的布局－屏幕分辨率指一个屏幕在面积内所能显示的点数－首屏页面宽度约为960～1000像素，高度约为570～600像素－固定宽度布局保持固定宽度，通常以像素作为衡量单位－流体布局通过伸展或收缩来适应屏幕，通常使用百分数－网格有助于创建页面布局，最常见的布局网格为960像素网格－可在一个页面中引用多个CSS文件＊html <link /><link /><link />＊html <link />css @import url( )@import url( )16、图像控制图像大小 width｜height设置背景图像 background:(#ffffff) url( ) no-repeat center top, (#ffffff) url( ) no-repeat center top,(#ffffff) url( ) no-repeat center top 顶层→底层－背景颜色 background-color－背景图像 background-image: url( )｜渐变-moz/webkit/0-linear-gradient(#fff,#000)－背景重复 background-repeat:repeat/repeat-x/repeat-y/no-repeat－背景绑定 background-attachment:fixed/scroll－背景位置 background-position:left/center/right top/center/bottom｜0% 50%控制图像翻转－html <a class="button" id="add-to-basket">Add to basket</a><a class="button" id="framing-options">Framing options</a>－css a.button {height: 36px;background-image: url("images/button-sprite.jpg");text-indent: -9999px;display: inline-block;}a#add-to-basket {width: 174px;background-position: 0px 0px;}a#framing-options {width: 210px;background-position: -175px 0px;}a#add-to-basket:hover {background-position: 0px -40px;}a#framing-options:hover {background-position: -175px -40px;}a#add-to-basket:active {background-position: 0px -80px;}a#framing-options:active {background-position: -175px -80px;}背景图像最好是低对比度的，如果是高对比度的，最好在文本下层插入半透明背景色17、HTML5布局添加页眉使用<header>元素，添加页脚使用<footer>元素添加导航使用<nav>元素添加文章使用<article>元素，添加附属信息使用<aside>元素组合标题使用<hgroup>元素把部分组合成整体使用<div>元素，就像一个容器把整体分解成部分使用<section>元素，就像一把剪刀◉实用信息18、建站过程和设计方法网站为谁而建？－个人：年龄、性别、国家、地区、教育程度、家庭状况、收入、职业、上网频率、上网设备－企业：规模、职务、建站目的、建站预算人们为什么要访问你的网站？－什么动机？→什么目标？→什么行动？怎么构建网站？－网站地图→线框图→高保真原型怎么设计网站？－形成视觉层次大小：较大的尺寸更容易引起注意颜色：明亮的颜色更容易引起注意样式：独特的样式更容易引起注意表现：合适的图像更容易引起注意－分组通过空白分组通过背景色分组通过边框分组－保持一致19、实用信息搜索引擎优化－站内优化：在页面网址、页面描述、页面标题、标题、正文、链接文本、图像说明添加关键词－站外优化网站分析 －常用分析工具：Google Analytics－多少人访问了你的网站、他们如何找到你的网站、他们来你的网站做了什么网站构建－为将网站上传到Web，需要注册一个域名并使用Web托管－为了让人们看到网站，需要使用文件传输协议 FTP 将网站文件上传到Web服务器
  •     我是在豆瓣看了评论才去买的，由于不是初学者，不是我看的，是给同学看的，收货后也看了一下，不觉得有那么好，跟国内一些入门书差不多=_=例子不多，有点像之前看到的国内的一本随身查标签属性的工具书。By the way,质疑一下，那么高的分数不是刷出来的吧？比《精通css》和《权威指南》还高=_=||补充一下，我想一些打高分的应该有一部分的分数是给这本的设计，但从书本内容来说，不值这个价钱，倒不如直接看w3c窃认为应更多关注书的内容，而不是排版设计
  •     我这样一个技术小白，可以比较轻松的看完了这本书，感觉很棒啊~~书中还有教程的网站，一边看一边学，可以记得很清楚。很喜欢这本书！这本书还是我在图书馆找到的，竟然没什么人借，真是浪费了~书的整体风格比较活泼，不想学校里的教科书那么枯燥。而且还有很多风格多样的图片，感觉像在看漫画书的感觉。要学习html的童鞋，可以先看看这本，打打基础，要是觉得不够再继续深度其他的书籍吧

精彩短评 (总计65条)

  •     HTML内容，CSS样式
  •     非常浅显，排版优秀的handbook，不过书感觉太窄了，有些东西得扣开书看。除此之外，没有任何缺点，我看了几本入门书，只有这本让我在做一些练习时候还能不时的翻阅。指导入门到位，物超所值！
  •     只能说，颜值高。
  •     内容比较浅显，不适合想深入学习的人，只符合初学者的程度（本人就是对代码一点都不懂的，所以才开始看这本书，目前看了五分之一，觉得比较适合我这种刚入门的）。装帧很差劲，看了五分之一，书页也脱了五分之一，真是一边看一边掉书页，看到哪一页就脱到哪一页，想翻回头去看看忘掉的内容是一件特别麻烦的事，还得一页页找，所以告知后来人，喜欢这本书就要小心脱掉的书页，请别打乱它们的顺序。除了装帧，我还是比较满意这本书的内容的
  •     内容绝对没的说，由浅入深，循序渐进。是本入门好书。印刷就算了，基本是看一页掉一页，装订很牵强。
  •     简单易读
  •     大牛强烈推荐
  •     除了整理回顾Html(5)、CSS(3)，还有关于网页设计的有益建议，读完当工具书也好（最好自己贴好标签索引，书本身的目录很简单），翻译有没翻完的句子但瑕不掩瑜，纸质书无线胶订着实比较坑脱页了。
  •     真的是非常非常好的一本html&css入门书籍，内容翔实而且排版配图生动有趣，我认为像我这样的初学者由这本书做桥梁进入网站构建的神奇世界真是再好不过了。
  •     简单明了，方便快速查阅
  •     看了一会就。。。内容还是比较适合我这种新手
  •     适合初学者，稍微有点编程基础，还是去w3school吧
  •     没想到我会是第一个吃螃蟹的人。读了该作者的前几本书，写得都还好。这本书排版是亮点，彩版。图片示例增多，让人很容易接受。似乎删去了JavaScript的部分，不过JavaScript也不是一本书就可以讲得很透彻的，可以买别的书辅助。重点是HTML5 和 CSS3。订购似乎比正式发售要便宜些。PS:正版书已经被我看散架。心疼中。这一条编辑于2013/10/4.
  •     内容还好，可惜看一页，掉一页，质量实在不敢恭维
  •     彩页，赏心悦目。有认真排版，设计的书。值得。
  •     入门最佳书籍
  •     内容满分，但是这装订也太差了吧，扣一分
  •     前端入门必看书目，翻译排版内容思路都很赞。主要梳理了HTML以及CSS的基础知识以及建站的实用技巧，除了display:flex没讲之外基本都提到了。只是由于全彩的所以有点贵=-=
  •     这本书写得很生动，做的也很精致，就是太爱掉页了，还没看多少呢都成画片儿了。
  •     书的质量是这样，味道大，纸质不尽人意，目测胶装掉页是早晚的。内容有限，优点在于看起来很轻松，一页一句话的感觉！评分高也许是因为看起来很休闲，图片多的像漫画，不会枯燥，但个人认为还是应该提高一点枯燥的程度。
  •     读过的颜值最高的技术书，看得很舒心。讲得浅显易懂，适合入门。
  •     精美的书籍，前端白痴表示收获很大
  •     Jon Duckett写得前端方面的书都不错，翻译得也挺好的，适合入门
  •     书籍制作有问题，易脱页
  •     最棒入门教材，没有之一
  •     一天翻完系列
  •     入门必备，简单易学
  •     真的零基础，2 days
  •     装订的很好，作为入门书很不错，同时是一部查阅书籍。
  •     适合快速阅读，花了两天看完，巩固一下html与css知识
  •     前端入门，很基础，配图讲很直观，非常喜欢这个排版
  •     精美简明的入门工具书。
  •     以前断断续续看了一些HTML和CSS的内容还有书， 这本书是最清晰明了的， 图文对照，颜色排版非常好， 赏心悦目， 我一天就把HTML部分看完了唯一的缺点是装订不好，中间竟然有一页掉下来了， 还有部分错位，粘的不好， 买来才一天而已， 书内容是非常不错的，五星，当然针对入门者，别指望它让你变成这两样的高手。还有做为手册查询也是不错的书是小的32开，400多页。
  •     赞，不仅有有语言Specifications，还有美学设计原则，典型设计流程，真正的实战导向，配合着Codecademy一起看的…但是，以后Design还是交给妹子了，我来好好研究实现…下一步，拿下Udacity Frontend Intro&Senior以及Fullstacker! Nanodegree！
  •     内容挺不错，还是全彩的，但是实在想不通这么厚的书，又用的是很硬的纸张印刷的，竟然用胶装，质量还差，一边翻一边就掉页了，看了不到50页封皮和胶脱落了，内页也开始掉了，这等看完不就变成一片一片的纸了？！质量差评啊！
  •     很基础
  •     新手和小白看的吧。设计和彩色印刷不错，正在担心会不会散页。
  •     一本就够
  •     后端狗，仔细阅读了HTML部分，CSS部分略读了一下。
  •     书刚收到，但是表面像旧的一样，打开书本第一页，一看脱胶了。真是郁闷。同学同样是在亚马逊买的，也没出现这个问题，第一次在亚马逊买东西，心情还是有点郁闷。唉
  •     赏心悦目的排版在代码书中难得一见，小白学起来也一点都不累~~
  •     这本书非常适合入门，看起来轻松又愉快，而且能够学习html和css的知识。彩板设计让人觉得一点也不枯燥，值得推荐。不过这书的质量真是捉急，没看几页，只要一握就悲剧了，成了好几块了，现在这本书已经大体分成了三块，还有几页散掉的纸。这本书不应该使用胶合的，应该线缝。希望改进
  •     很好的入门书
  •     除了书的装订不好以外，内容真心棒！给我这种基础不稳固的人查漏补缺，介绍了新的HTML 5和CSS 3还有网站的设计以及网站的优化，虽然不多，但是给入门的人一个方向。注：22个番茄时间，2016.12.12-2016.12.14
  •     不想在 w3c 哪里打瞌睡的话，这本书真不错，而且网站也有扩展内容。
  •     买之前看了大家的评论，无外乎就两点：一是内容好，装帧漂亮；二是脱胶= =以至于等待快递送货的这段时间，整日忐忑不安。今天收到包裹后，迫不及待就开始检查这本书，发现没有脱胶现象后，真的很开心啊~不得不说内页的排版设计真的很精美啊，知识点一目了然，搭配head first一起阅读，简直就是初学者的福音~
  •     mark@0318.不管是初学还是有基础，都有值得看的地方。语义化很重要。另外还有设计原则的讲解也很实用，三言两语就说到痛点。一些标签的细节也很好，
  •     大部分都是图，排版精良，还算良心，适合入门，没有太多干货。现在京东上买已经重印了不会掉页了
  •     挺好的
  •     非常适合入门
  •     看起来虽然很厚 但是内容挺少的 设计不错 很适合入门的看 会比你去看w3cschool有趣点.但是还是不够全面～可以作为入门～
  •     推荐！
  •     编排风格简洁美观，适合初学。
  •     排版精美
  •     看着新买的书就开始散架心疼。
  •     很基础但系统，基础大多数网站博客能做到，但系统，一般只有书籍能够做到。
  •     适合产品人员和初级设计人员了解
  •     早点没遇到，都入过门了才发现这种好书，也不值得返回看了…排版精良，比画册还精彩的技术书，简直是本艺术品
  •     这本书感觉不值那个价钱....太花哨了....
  •     本书采用的是普通胶装，但相比一般图书，这本书的胶装太差了，现在我看这本书是看到哪页掉到哪页，等我看完这本书手里也就只剩一个封皮和一堆散页了。这么好的排版和印刷，生生让烂装订给毁了，可惜可惜！
  •     用半个月的时间生啃了英语版的HTML&CSS:DESIGN AND BUILD WEBS，然后又生啃了JAVA和几个CSS网站，对于一个完全的文科生（艺术生）来讲，这是巨大的挑战！！！！！！！
  •     看着很舒服，排版布局都很好！
  •     设计的目的在于传达信息
  •     买过最有用的工具书，对前端感兴趣的可以看下（真的会有人感兴趣吗
  •     装订太差，容易掉页，内容还行，适合初学者
 

农业基础科学,时尚,美术/书法,绘画,软件工程/开发项目管理,研究生/本专科,爱情/情感,动漫学堂PDF下载,。 PDF下载网 

PDF下载网 @ 2024