j8typz 发表于 2024-6-29 12:59:16

HTML、CSS、JavaScript分别实现什么功能?


    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">学习Web前端<span style="color: black;">研发</span><span style="color: black;">基本</span>技术<span style="color: black;">必须</span><span style="color: black;">把握</span>:HTML、CSS、JavaScript,<span style="color: black;">那样</span>这三个都是分别实现什么功能的呢?下面和<span style="color: black;">博主</span><span style="color: black;">一块</span>来<span style="color: black;">瞧瞧</span>吧!</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic3.zhimg.com/80/v2-ad957223f02a2609b4ea6fcca8bad07e_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">1、</span>HTML是网页内容的载体</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">内容<span style="color: black;">便是</span>网页制作者放在页面上想要让用户浏览的信息,<span style="color: black;">能够</span><span style="color: black;">包括</span>文字、<span style="color: black;">照片</span>、视频等。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">2、</span>CSS样式是表现</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">就像网页的外衣,<span style="color: black;">例如</span>:标题字体、颜色变化、为标题加入背景<span style="color: black;">照片</span>、边框等。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">所有这些用来改变内容外观的东西<span style="color: black;">叫作</span>之为表现。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">3、</span>JavaScript是用来实现网页上的特效效果</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">例如</span>:鼠标滑过弹出下拉菜单、鼠标滑过表格的背景颜色改变、焦点<span style="color: black;">资讯</span>的轮换。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">能够</span>理解为:有动画的、有交互的<span style="color: black;">通常</span>都用JavaScript来实现。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML之代码注释:</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">代码注释是<span style="color: black;">帮忙</span>程序员标注代码的<span style="color: black;">功效</span>,过一段时间后再看你所编写的代码,就能<span style="color: black;">火速</span>想起这段代码的<span style="color: black;">功效</span>。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">代码注释不仅方便程序员自己回忆起以前代码的用途,还<span style="color: black;">能够</span><span style="color: black;">帮忙</span>其他程序员<span style="color: black;">火速</span>的读懂你的程序的功能,方便多人合作<span style="color: black;">研发</span>网页代码。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML之语义化:</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">语义化其实<span style="color: black;">便是</span>明白<span style="color: black;">每一个</span>标签的用途,它能够让你的网页更好的被搜索引擎理解。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">它的好处<span style="color: black;">能够</span>总结为两点:</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">(1)<span style="color: black;">更易</span>被搜索引擎收录;</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">(2)<span style="color: black;">更易</span>让屏幕阅读器读出网页内容;</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML之em、strong和span的区别:</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">(1)和标签是为了强调一段话中的<span style="color: black;">重要</span>字时<span style="color: black;">运用</span>,<span style="color: black;">她们</span>的语义是强调;</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">(2)标签是<span style="color: black;">无</span>语义的,它的<span style="color: black;">功效</span><span style="color: black;">便是</span>为了设置单独的样式用的;</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML之summary,caption:</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">功效</span>是为table添加标题和摘要</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">摘要的内容不会在浏览器中<span style="color: black;">表示</span>出来,它的<span style="color: black;">功效</span>是<span style="color: black;">增多</span>表格的可读性(语义化),使搜索引擎更好的读懂表格内容,还<span style="color: black;">能够</span>使屏幕阅读器更好的<span style="color: black;">帮忙</span>特殊用户读取表格内容。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">代码注释:</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在CSS中的注释语句:用/注释语句/来标明</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在Html中<span style="color: black;">运用</span>来标明</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML<span style="color: black;">选取</span>器的问题:</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">后代<span style="color: black;">选取</span>器与子<span style="color: black;">选取</span>器的区别</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">子选择器(child selector)仅<span style="color: black;">指的是</span>它的直接后代,<span style="color: black;">或</span>你<span style="color: black;">能够</span>理解为<span style="color: black;">功效</span>于子元素的<span style="color: black;">第1</span>代后代。而后代<span style="color: black;">选取</span>器是<span style="color: black;">功效</span>于所有子后代元素。后代<span style="color: black;">选取</span>器<span style="color: black;">经过</span>空格来进行<span style="color: black;">选取</span>,而子<span style="color: black;">选取</span>器是<span style="color: black;">经过</span>“&gt;”进行<span style="color: black;">选取</span>。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">总结:</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">功效</span>于元素的<span style="color: black;">第1</span>代后代,空格<span style="color: black;">功效</span>于元素的所有后代。成长离不开与优秀的同伴<span style="color: black;">一块</span>学习,<span style="color: black;">倘若</span>你<span style="color: black;">必须</span>好的学习环境,好的学习资源,<span style="color: black;">这儿</span>欢迎每一位热爱编程,热爱前端的小伙伴,<a style="color: black;">web前端学习圈</a></p>




4lqedz 发表于 2024-10-19 19:20:32

你的话语真是温暖如春,让我心生感激。

m5k1umn 发表于 2024-10-24 21:07:42

楼主的文章深得我心,表示由衷的感谢!

j8typz 发表于 前天 02:52

感谢楼主的分享!我学到了很多。
页: [1]
查看完整版本: HTML、CSS、JavaScript分别实现什么功能?