JavaScript实现字体大小变化特效及CSS样式操作

"北大青鸟JS教程中的样式特效制作，主要关注如何通过JavaScript改变字体大小。教程中介绍了两种实现思路，一是直接在JavaScript代码中改变元素的`style.fontSize`属性，二是利用HTML的事件处理函数`onMouseOver`和`onMouseOut`来响应鼠标悬停和离开时调整字体大小。在实际应用中，`style`属性允许我们动态地修改元素的样式，而`font-size`是CSS中用于设置字体大小的样式规则。此外，教程还涉及了其他CSS样式特效，如浮动广告图片、全选/反选复选框的实现，以及样式规则的语法、`onMouseOver`与`onMouseOut`事件的区别、`inline`、`block`和`none`等显示属性的作用。学习目标包括使用`style`样式属性动态改变边框颜色，使用`className`类名属性改变按钮背景图片，以及运用`display`属性实现层或图片的隐藏/显示切换特效。教程中回顾了CSS样式表的相关知识，包括行内样式、内嵌样式和外部样式表，以及各种文本属性（如`font-size`、`font-family`、`font-style`、`color`、`text-align`）、背景属性（如`background-color`、`background-image`、`background-repeat`）等，还演示了不带下划线的超链接样式、细边框样式和图片按钮样式。" 在这个JS教程中，重点是掌握JavaScript与CSS的结合使用，以实现动态的样式变化。首先，你需要理解`this.style.fontSize`的用法，这允许你在JavaScript中直接操作DOM元素的样式属性，改变字体大小。例如，当鼠标悬停在某个元素上时，可以使用`onMouseOver`事件将`fontSize`设置为特定值，如'24px'，当鼠标离开时，通过`onMouseOut`事件将`fontSize`恢复原值，如'14px'。 同时，教程也涵盖了CSS样式的基础知识，包括样式规则的语法、不同类型的样式应用（行内、内嵌、外部）以及各种属性的用途。例如，`background-color`用于设定元素的背景色，`background-image`用于设置背景图像，`background-repeat`控制背景图像的重复方式。此外，`display`属性的`inline`、`block`和`none`分别对应元素的行内显示、块级显示和隐藏，这对于实现元素的隐藏/显示切换特效至关重要。 在JavaScript部分，`getElementById()`和`getElementsByName()`是获取DOM元素的重要方法，前者根据ID获取单个元素，后者则根据名称获取一组元素。这些方法是实现动态交互效果的基础。 最后，本章的学习任务包括制作各种样式特效，如51job的弹出层、图片切换和按钮样式的改变。通过这些实践，你可以进一步巩固JavaScript和CSS的结合应用，提升网页动态效果的开发能力。