初中信息科技 / 义务教育版(2024) / 七年级全一册(2024) / 第四单元 校园活动线上展 / 第18课 美化网页方法多 / 编号:26981684

第18课 美化网页方法多 课件 2026-2027学年人教版初中信息科技七年级全一册

日期:2026-11-11 科目:初中信息技术 类型:课件 来源:二一教育课件站
关键词:网页,美化,CSS,HTML,七年级,一册
预览图 7 张
初中信息技术 初中信息技术
(课件网) 义务教育2024 七年级全一册 第四单元:校园活动线上展 第18课:美化网页方法多 义务教育2024 七年级全一册 第18课:美化网页方法多 学习 目标 知道用HTML代码简单美化网页的操作方法。 知道串联样式表的作用,初步学会用它美化网页。 3 能根据需求,分析不同方法的特点并合理选择,提高解决问题的效率。 第18课:美化网页方法多 义务教育2024 七年级全一册 问题情境 导入 新课 上一课编写了简单的网页,好似用HTML语言搭建了“新房屋”的结构,接下来要想办法对“新房屋”进行装修美化。本课将介绍如何用HTML代码和CSS( cascading style sheets,串联样式表)等方式美化网页。 义务教育2024 七年级全一册 第18课:美化网页方法多 学习内容 一、用HTML代码美化网页 二、用CSS美化网页 义务教育2024 七年级全一册 一、用HTML代码美化网页

科技节体验项目--

科机器狗

    机器狗是一种模拟真实犬只形态和部分行为的机器设备、能够实现行走,坐下,翻滚等多种动作,机器狗的出现为人工智能和机器人研究提供了新的超像空间,也让更多人得以近距离接触机器人技术。 

用HTML标签可以设定网页的文字大小、背景颜色等 用HTML代码美化网页 义务教育2024 七年级全一册 一、用HTML代码美化网页 打开上一课完成的介绍科技节某个项目的网页,使用HTML标签及属性对网页进行美化,如设置标题、设置背景等,体会这种方式是否 便捷,美化效果好不好。 义务教育2024 七年级全一册 二 、用CSS美化网页 用HTML代码进行美化,操作非常烦琐,美化效果也有限。在实际应用中,人们经常用CSS来美化网页。 如果将HTML代码比作建造房屋的“建筑师”,那么CSS就是装修房屋的“装潢设计师”(图18.2)。CSS可以描述网页等文档的外观和格式,控制某类HTML标签内容的颜色、字体、宽度、高度等。 义务教育2024 七年级全一册 二 、用CSS美化网页 图18.2 CSS的作用 义务教育2024 七年级全一册 二 、用CSS美化网页 要通过编写CSS美化网页,就必须先了解CSS的基本语法规则。CSS语句主要由两部分构成:选择器;一条或多条声明。 选择器指向需要改变样式的网页元素。一个选择器对应的声明可有多条,每条声明由属性和值组成,属性和值之间用冒号分开。每条声明以分号结束,所有声明用一对大括号括起来 (图18.3)。 义务教育2024 七年级全一册 二 、用CSS美化网页 图18.3 CSS基本语法结构 选择器 (需要改变样式的HTML元素) P { 声明开始大括号 font-size:14px; color #606266: : 声明 属性和值被冒号分开,以分号结束 声明结束大括号 属性 属性值 } 义务教育2024 七年级全一册 二 、用CSS美化网页 网页内的样式表可以放在之间 图18.4 网页内的样式表 义务教育2024 七年级全一册 二 、用CSS美化网页 1.查阅关于CSS的相关资料,了解CSS的书写规则和常用指令。 2.用编辑器打开网页,尝试用CSS对网页文本、标题、背景等进行美化。 3.保存网页文件,然后重新浏览,看看修改后显示效果的变化。 4.交流讨论使用CSS美化网页的心得。 尝试用CSS设计美化网页 动手实践 义务教育2024 七年级全一册 1.用HTML代码可以美化网页。 2. CSS可以让网页呈现出效果一致的美化风格。 3.使用CSS美化网页,效果更好。 课堂总结 下 课 Thanks! https://www.21cnjy.com/recruitment/home/fine ... ...

~~ 已预览到文档结尾了 ~~