1、首先，打开html编辑器，新建html文件，例如：index.html，输入问题基础代码。
2、在index.html中的<script>标签中，输入js代码：$(‘a’).hover(function(){$(‘img’).css(‘display’,’block’);})3、浏览器运行index.html页面，此时鼠标移动到超链接上，下面的图片自动显示了出来。
相信正在学习Web前端知识的小伙伴们都知道，学习Web前端开发基础技术需要掌握：HTML、CSS、JavaScript，那么这三个都是分别可以创建什么有趣的东西呢？
一、HTML是网页内容的载体
内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。
二、CSS样式是表现
就像网页的外衣，比如：标题字体、颜色变化、为标题加入背景图片、边框等。
所有这些用来改变内容外观的东西称之为表现。
三、JavaScript是用来实现网页上的特效效果
比如：鼠标滑过弹出下拉菜单、鼠标滑过表格的背景颜色改变、焦点新闻的轮换。
可以理解为：有动画的、有交互的一般都用JavaScript来实现。
HTML之代码注释：
代码注释是帮助程序员标注代码的作用，过一段时间后再看你所编写的代码，就能很快想起这段代码的作用。
代码注释不仅方便程序员自己回忆起以前代码的用途，还可以帮助其他程序员很快的读懂你的程序的功能，方便多人合作开发网页代码。
HTML之语义化：
语义化其实就是明白每个标签的用途，它能够让你的网页更好的被搜索引擎理解。
它的好处可以总结为两点：
(1)更容易被搜索引擎收录；
(2)更容易让屏幕阅读器读出网页内容；
HTML之em、strong和span的区别：
(1)和标签是为了强调一段话中的关键字时使用，他们的语义是强调；
(2)标签是没有语义的，它的作用就是为了设置单独的样式用的；
HTML之summary,caption：
作用是为table添加标题和摘要
摘要的内容不会在浏览器中显示出来，它的作用是增加表格的可读性(语义化)，使搜索引擎更好的读懂表格内容，还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。
代码注释：
在CSS中的注释语句：用/*注释语句*/来标明
在Html中使用来标明
HTML选择器的问题：
后代选择器与子选择器的区别
子选择器(child selector)仅是指它的直接后代，或者你可以理解为作用于子元素的第一代后代。而后代选择器是作用于所有子后代元素。后代选择器通过空格来进行选择，而子选择器是通过“>”进行选择。
总结：
>作用于元素的第一代后代，空格作用于元素的所有后代。
以上就是偶总结的HTML、CSS、JavaScript这三个分别能实现的功能，希望能帮到大家！
1、标题标签： h1~h6 ctrl+1~6
2、段落标签： pctrl+shift+p
3、换行标签： brshift+回车
4、水平线： hr
5、加粗标签： strong ctrl+b
6、倾斜标签： emctrl+i
7、空格标签：
8、图片标签：<img src=’图片路径’ alt=’图片加载错误提示文字’ title=’鼠标悬停文字’ width=’宽度’ height=’高度’ />
9、超链接：<a href=’链接路径’ traget=’_blank’>文本/图片</a>
10、锚链接：
(1)定义锚：给标签加id属性，id=”top”
(2)跳转到锚：<a href=”#top”>top</a>
11、行级标签
1.Strong
2.Em
3.A
4.Img
12、块级标签
1.标题标签
2.段落标签
Display：inline-block设置元素具有行级标签和块级标签的属性
.da dl dd p:nth-of-type(1)：当dd下面的段落p有好几个的时候，你有只想给第一个段落p加样式的时候用到这个！！！
Float：浮动
Z-index：层次 z-index：1比z-index：2 低一层
设置div半透明的代码：opacity:0.7；
设置div溢出隐藏的代码：overflow:hidden;
设置css的动画效果：transition: all 0.5s linear
设置css时图片在div中同比例放大或者同比例缩小：transform: scale(1.1)
html a标签鼠标特效 html鼠标移动到超链接上时 显示图片的效果怎么做的 – html – 前端 系统html模板
