扫一扫
关注中图网
官方微博
本类五星书更多>
-
>
中国历史故事连环画(全12册)
-
>
Paddington Classic Collection 小熊帕丁顿系列-园林篇全3册
-
>
儿童好奇心大百科
-
>
写给儿童的中国传统文化微读本：第一辑(全4册)
-
>
写给儿童的中国传统文化微读本：第三辑(全4册)
-
>
中国传统修身故事绘本(第一辑)(全5册)
-
>
(精)独角兽魔法全书大礼盒(全3册)
HTML+CSS趣码快乐编程 版权信息
- ISBN：9787536977303
- 条形码：9787536977303 ; 978-7-5369-7730-3
- 装帧：一般胶版纸
- 册数：暂无
- 重量：暂无
- 所属分类：>>
HTML+CSS趣码快乐编程 本书特色
适读人群 ：5-12岁如今互联网发展极其迅速，我们的生活已经离不开互联网，在互联网发展的历史中出现了一个又一个大咖，比如比尔·盖茨、Facebook创始人马克·扎克伯格等互联网领军人物，他们从小就对编程感兴趣，十几岁就可以编写计算机程序。编程其实不难，只要你喜欢玩，喜欢探索新奇的失误，小朋友们一样可以轻松学习编程。HTML+CSS趣码快乐编程图书主要面向青少年儿童，在风格设计方面比较活泼、生动、有趣，将专业术语与生活中的常见事物进行类比，便于理解，层层深入，让孩子们像看动画一样轻松主动地学习编程。本书囊括HTML、CSS中主要且必要的知识点，每章内容分不同模块逐步导入，设定“知识目标”，通过“指点迷津”进行内容讲解，“通关秘籍”总结概括本章重要知识点，再经过“大显身手”练习加强巩固，“项目创新大通关”可带领读者运用所学内容自己实现编程设计。除此之外，每章节后配有相应的二维码，扫码即可观看老师对本章内容的讲解，让读者更好地理解领会要点，逐步实现自己上手操作的能力。
HTML+CSS趣码快乐编程 内容简介
HTML+CSS趣码快乐编程本书主要讲解前端页面的基础铺设，其内容分不同模块导入，层次分明、前后贯穿，逐步深入学习HTML及CSS的基础知识与运用。第1章，主要简单介绍HTML的概况，初步对HTML产生兴趣和好奇。第2章，介绍HTML结构中常用的标签以及运用，通过简单生动的举例来协助读者理解与操作。第3章，介绍HTML页面美观，引人入胜的秘密武器——CSS工具。第4章——第11章，分别介绍在页面设计中所常用的基本的元素及工具，字体设计、盒模型与行块元素、表格的制作、表单的运用、内容的显示与隐藏、变换与过渡效果、浮动以及定位等的设定。
HTML+CSS趣码快乐编程 目录
第1章探索HTML之美
1.1认识**个朋友——HTML的概念/2
HTML的基本概念/2
HTML与其他编程语言的区别/2
HTML的发展历程/3
初识浏览器/3
1.2HTML的骨架结构/5
HTML的基本结构与语法/5
编辑器的下载及使用/7
1.3初识标签/14
双标签与单标签的基本结构/14
标签之间的关系/16
HTML标签的语义化/17
第2章HTML的宝藏——常用标签
2.1排版标签/20
p标签/20
br标签/21
hr标签/22
注释标签/22
排版标签的综合运用/23
2.2字体标签/26
h系列标签/26
粗体标签/28
斜体标签/29
sup标签和sub标签/30
字体标签的综合运用/30
2.3列表标签/33
什么是列表？/34
无序列表标签/34
有序列表标签/37
自定义列表标签/39
2.4图形标签/43
什么是图片标签？/43
img标签的基本属性/43
路径/44
路径的分类/46
img标签的其他属性/47
2.5a标签/53
a标签的应用场景/53
a标签的语法/53
a标签的属性/56
2.6div标签与span标签/58
网页拆分/58
网页拆分原则/59
div标签/60
span标签/63
2.7特殊字符标签/66
常用的特殊字符/66
2.8初识行块标签/67
块级标签/67
行级标签/68
常见块级标签和行级标签/68
第3章宝藏的钥匙——CSS
3.1认识CSS/70
什么是CSS？/70
CSS的作用/70
CSS基础语法/70
CSS的引入方式/71
3.2CSS布局与选择器/74
id选择器/74
字体颜色（color）/75
CSS基础属性及常用单位/76
background进阶/78
class选择器/83
id与class命名规范/85
外边距（margin）/85
内边距（padding）/89
边框（border）、描边（outline）/90
3.3CSS选择器进阶/95
标签选择器/95
后代选择器/96
群组选择器/98
伪类选择器/99
通配符/101
第4章字体与文本
4.1字体操作属性/106
字体类型（font-family）/106
字体大小（font-size）/106
字体样式（font-style）/107
字体粗细（font-weight）/107
字体属性简写（font）/108
4.2文本操作属性/111
文本行高（line-height）/112
文本修饰（text-decoration）/114
文本首行缩进（text-indent）/115
文本水平对齐（text-align）/116
列表样式（list-style）/118
第5章盒模型与行块元素
5.1盒模型与行块元素的概念/122
标准盒模型/122
行级与块级元素的区别/122
5.2行块元素转换/124
行块元素的转换属性/124
浏览器调试台/126
第6章整齐的道路——表格
6.1网页中的表格/130
为什么使用表格？/130
表格的基本结构/130
表格的基本语法/131
表格的结构化/132
跨列、跨行的表格/133
6.2表格的综合应用/135
第7章重要城市——表单
7.1初识表单/140
表单概述/140
form标签/140
7.2表单中的常用标签/141
input标签/141
input标签分类/141
多行文本域/143
下拉列表/144
label标签/144
7.3表单属性/146
size属性/146
maxlength属性/147
checked属性/147
selected属性/147
placeholder属性/148
disabled属性/149
7.4表单的应用/151
第8章大显身手——显示与隐藏
8.1display与visibility/164
display与visibility的概念/164
display与visibility的属性值/164
display与visibility的区别/164
8.2opacity（不透明度）/166
opacity的概念/166
opacity的应用/167
第9章感受2D变换与过渡效果
9.1transition（过渡）/170
9.2transform（变换）/173
旋转（rotate）/174
缩放（scale）/174
平移（translate）/177
第10章浮动的奥秘
10.1认识浮动/180
HTML文档流介绍/180
什么是浮动？/181
浮动属性介绍/182
10.2浮动的应用/182
元素向左浮动/182
元素向右浮动/183
相邻元素含有float属性/184
10.3清除浮动带来的影响/186
第11章自由掌控——定位
11.1认识定位/194
什么是定位？/194
定位属性介绍/195
11.2定位的运用/195
相对定位/195
绝对定位/196
固定定位/197
神奇的锚点/198
定位的综合运用/199
课后习题答案/207
展开全部
HTML+CSS趣码快乐编程 节选
1.1认识**个朋友——HTML的概念 1. 熟练掌握HTML的概念。 2. 理解HTML与其他编程语言的区别。 3. 了解HTML的发展及常用浏览器。 指点迷津 HTML的基本概念 HTML（Hyper Text Markup Language），中文翻译为“超文本标记语言”。它是用来描述网页的一种语言（如图1-1）。我们平常看到的网页就是工程师编写的HTML文件的呈现。 图1-1HTML文件 “超文本”是指页面内不仅包含文本内容，还可以包含图片、链接，甚至音乐、程序等非文字元素。不仅如此，它还可以从一个文件跳转到另一个文件，功能强大。 一个HTML文件不仅包含文本内容，还包含一些标记（即标签，在第2章进行具体介绍），标记语言要通过浏览器帮助解析才能*终实现完美的网页效果。 需要大家牢记的一点是HTML文件的后缀名是“.html”或者“.htm”。 HTML与其他编程语言的区别 常见的计算机语言主要有三大类：编译语言、标记语言和脚本语言。 编译语言：例如C、C++、Java等，它们在程序执行之前需要一个专门的编译过程，运行时直接使用编译结果即可。编译语言的优点是程序执行效率高，缺点是非常依赖编译器，跨平台性较差。 标记语言：例如HTML，是一种将文本以及文本相关的其他信息结合起来，通过很多标记（标签）展现出关于文档结构和数据处理细节的电脑文字编码。标记语言的优点是可阅读性强，易于学习。 脚本语言：例如JavaScript、PHP、Python等。脚本语言介于标记语言和编译语言之间，不需要编译，可以直接使用，由解释器负责解释。脚本语言比编译语言的开发速度快，但脚本语言往往不够全面。 HTML的发展历程 HTML一直处于高速发展之中，第1版超文本标记语言（并非标准）在1993年6月作为互联网工程工作小组（IETF）工作草案发布。而后经历了HTML2.0版本、HTML3.2版本、HTML4.0版本、HTML4.01版本等调整，在2014年10月28日，HTML5发布。它是W3C（万维网联盟）推荐标准，也是目前使用*广泛的版本。 初识浏览器 浏览器是网页运行的平台，我们平常看到的网页都是使用浏览器进行阅读的。 浏览器的工作原理：浏览器是HTML的解析器，解析HTML文件，然后在浏览器窗口中展示解析页面。 目前支持HTML5的常用浏览器（图1-2）有IE、火狐（Firefox）、谷歌（Chrome）、苹果（Safari）和欧朋（Opera）等。 图1-2常用浏览器图标 通关秘籍 1.HTML是超文本标记语言，它不仅包含文本内容，还可以包含图片、链接、音乐等非文字元素。 2.HTML的作用是用标签来描述网页，让网页内容在浏览器中展示出来；HTML文件的后缀名是.html或者.htm。 3.目前使用*广泛的是HTML5版本，并且仍然在不断完善中。 大显身手 编程基本功 1.（单选题）HTML是什么意思？（） A.高级文本语言 B.超文本标记语言 C.扩展标记语言 D.图形化标记语言 2.（单选题）浏览器对于HTML文档的作用是什么？（） A.浏览器用于创建HTML文档 B.浏览器用于查看HTML文档 C.浏览器用于修改HTML文档 D.浏览器用于删除HTML文档 3.（单选题）下面关于HTML说法错误的是（）。 A.HTML是一种标记语言 B.HTML可以控制页面和内容的外观 C.HTML文档总是静态的 D.HTML文档是超文本文档 4.（简答题）请简单描述一下HTML的作用。 1.2HTML的骨架结构 1. 熟练掌握HTML的基本结构及语法。 2. 学会使用编辑器提高代码编写效率。 指点迷津 HTML的基本结构与语法 轻松学 生活中盖房子需要先打地基再搭建结构，编写HTML文件也要遵循同样的道理。常见的网页文件基本都由图1-3中的三对标签构成骨架结构。 图1-3HTML的基本结构标签 HTML的基本语法如下： ...：这对标签告诉浏览器“我是html文件”，书写的代码都要放在这对标签的中间。 ...：head是头部的意思，头部中提供了关于网页的信息。 ...：body是身体的意思，这里是指网页的主体，在网页中展示的内容都写在这对标签的中间。 轻松练 应用HTML的基本结构，在浏览器中展示一句话：“欢迎来到趣码星球！！”，并将网页的标题设置为“Hi, go code！”，如图1-4所示。 图1-4实现效果图 思维导学 若要实现图1-4的效果，我们需要在书写代码时分4步进行： 第1步 打开记事本，保存时修改文件后缀名为.html，“保存类型”选择“所有文件”。 第2步 写出HTML的基本结构。 第3步 书写网页标题，网页标题需要写在head标签中。 这里用到了标签，这个标签用来设置网页的标题。 第4步 书写网页的主体内容，需要写在body标签中。 *后，用浏览器打开这个文件，效果即如图1-4所示。 编辑器的下载及使用 编辑器是辅助编写代码的一种工具软件，它能较大程度地提高代码的编写效率。比如，原来需要输入十多个字母来编写代码，在编辑器中，输入两三个字母就可以完成代码的自动提示，既节约了时间，又避免了代码拼写错误等问题，降低了错误出现的频率。接下来将会介绍我们编写代码可使用的编辑器：VS Code。 VS Code编辑器的介绍 VS Code的全称是Visual Studio Code，是微软公司推出的一款免费轻量级编辑器，体积小，打开文件速度快，还可以根据需求安装各种插件。 VS Code编辑器的下载及安装方法 下载地址 在浏览器地址栏里输入https://code.visualstudio.com（VSCode编辑器的官方地址），进入页面后，下载区域如图1-5所示。 图1-5VS Code编辑器下载页面 选择下载版本 单击图1-5中右上角的Download（下载按钮），便可进入下载页面，进行对应的版本选择（如图1-6），根据自己的电脑系统选择下载版本。以Windows系统为例，下载Windows版本（图1-6左侧），单击“Windows”后会弹出一个下载窗口，选择合适的存储位置后，下载即可。 图1-6VS Code版本选择页面 安装流程 下载完成后双击打开安装程序，选择“我接受协议”，如图1-7所示。 图1-7安装步骤 接受协议后一直单击“下一步”，直到安装完毕。安装完成后桌面上会出现一个图标，如图1-8所示。 图1-8VS Code图标 双击图标打开后出现主界面，如图1-9所示。 图1-9VS Code主界面 注意 VS Code版本在不断更新，下载安装后的界面可能存在一定差异，但基本功能一致。 VS Code的使用方法 单击图1-10中自定义部分红框标注的“JavaScript”和“Sublime”，安装JavaScript插件和Sublime快捷键插件。这两个插件大家一定别忘了安装，否则会影响后续操作。 图1-10插件安装 创建文件 编写HTML代码需要HTML文件，HTML文件的后缀名必须为.html或者.htm。那么，在编辑器中如何创建HTML文件呢？ 创建文件有两种方式： 1.单击菜单栏左上角的“文件”按钮，会弹出一个对话框，单击**个“新建文件”即可创建文件。 2.点击“开始”下的“新建文件”也可以创建文件，如图1-11所示。 图1-11创建文件 保存文件 创建完成后会进入一个名为Untitled-1的空文本页面，在该页面下，按下Ctrl+S快捷键进行保存，会弹出如图1-12所示的界面，用于保存并修改文件类型。 图1-12文件类型保存 注意 图1-12中的红色框是修改文件名区域，文件名*好用英文（平常的小练习、小案例可以使用中文），同时必须保证文件后缀名是.html。 快速生成HTML文档结构 修改完文件名后，接着在页面中输入“!”（必须是英文输入法下的感叹号，代码中禁止出现任何中文输入法标点符号）,如图1-13所示。 图1-13快速生成HTML结构 在图1-13中，小红框左上角出现了一个类似数字5的图标，这就是HTML文档的标识，说明该文件是HTML文档。输入感叹号（或输入html:5）后，按下键盘上的Tab键，就会生成HTML基本文档结构，如图1-14所示。 图1-14HTML基本文档结构 以上就是VS Code创建HTML文档的所有流程。 VS Code常用快捷键 下面我们来认识一下VS Code编辑器的常用快捷键，详见下表。 VS Code编辑器的常用快捷键 常用快捷键组合 作用 Ctrl+S 快速保存 Ctrl+Z 返回上一次操作 Ctrl+Shift+S 快速复制 通关秘籍 1.body标签存放的是网页的主体内容。 2.head标签存放的是网页的头部内容。 3.title标签用来设置网页的标题。 4.编辑器中有很多快捷键可以提高代码的编写速度。例如生成HTML的基本文档结构可以输入“!”后，再按下Tab键，也可以输入html:5再按下Tab键。 大显身手 一、编程基本功 1.（单选题）下列哪个标签用于表示HTML文档的结束？（） A. B. C. D. 2.（单选题）关于下面语句A和B，说法正确的是（）。 语句A：HTML文档一般都会包括“头”和“主体”两部分。 语句B：HTML文档的扩展名为.htm或.html。 A. 两句都对 B. 两句都错 C. 只有A对 D. 只有B对 3.（单选题）可以在下列哪个HTML元素中放置网页标题？（） A. B. C. D. 4. (多选题）使用浏览器运行下面这段代码，下列说法正确的是（）。 A. 网页的标题是“欢迎学习 HTML” B. 网页的标题是“我的**个HTML文档” C. 网页的内容是“欢迎学习 HTML” D. 网页的内容是“我的**个HTML文档” 5．（简答题）本节你学会使用哪个编辑器？说一说如何使用编辑器生成HTML基本结构。 二、转动编程大脑 自己动手完成一个HTML页面，要求在页面中简单介绍你自己（不少于100字），并将网页标题设置为自己的名字。（样例如下） 1.3初识标签 1. 了解标签的定义，熟练掌握单双标签。 2. 掌握标签之间的嵌套及并列关系。 指点迷津 前面提到的、、都是标签。标签就是放在标签符“”中表示某个功能的编码命令，也称为HTML标签或HTML元素。标签可以简单地分为双标签和单标签两大类。 双标签与单标签的基本结构 轻松学 双标签 语法：内容。
书友推荐
- >
史学评论
史学评论
¥17.2¥42.0 - >
上帝之肋:男人的真实旅程
上帝之肋:男人的真实旅程
¥19.3¥35.0 - >
诗经-先民的歌唱
诗经-先民的歌唱
¥15.9¥39.8 - >
朝闻道
朝闻道
¥9.0¥23.8 - >
李白与唐代文化
李白与唐代文化
¥9.9¥29.8 - >
二体千字文
二体千字文
¥16.0¥40.0 - >
自卑与超越
自卑与超越
¥17.1¥39.8 - >
【精装绘本】画给孩子的中国神话
【精装绘本】画给孩子的中国神话
¥17.6¥55.0
本类畅销
-
让我告诉你:章鱼是不是鱼(九品)
¥2¥6.8 -
地球简史(图解版)
¥10.6¥28 -
让我告诉你:龟为什么长寿(九品)
¥2¥6.8 -
让我告诉你:为什么马站着睡觉(九品)
¥2¥6.8 -
亲爱的科学【人体】
¥14.4¥36 -
亲爱的科学【动物】
¥14.4¥36
