网页内容排版练习——涉及下划线的用法，图片的插入，类选择器，空格，斜体

本文链接：https://blog.youkuaiyun.com/Javaprintf/article/details/108411592

本文深入探讨了Web前端开发工程师所需掌握的技术要点，包括熟悉jQuery、YUI等JS框架，理解HTML+CSS网页制作方法，以及对HTML5+CSS3等前沿技术的应用。强调了对主流浏览器兼容性的了解，并通过具体实例展示了如何运用这些技能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

相关标签的解析：

<img src="图片地址" align="left" hspace="30">：为图片插入的方式，图片align=left为居左，hspace=30是边距。

代码中涉及了类选择器的使用，class=“no1”等这样会比较好看

在no5 中有一个 text-decoration:underline deepskyblue; 该标签为文章下划线的标签，后面的是他的下划线的颜色。

<em> 是表示文字斜体

&nbsp 为空格标签。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        h2{
           color: rgba(177, 120, 14, 0.637); 
        }
        .no1{
            color: deepskyblue;
        }
        .no3{
             font-size: 15px;
             color: deepskyblue;
        }
        .no4{
            color: rgba(177, 120, 14, 0.637);
            font-size: 20px;
        }
        img{
            width: 350px;
            height: 250px;
        }
        .no5{
            color: deepskyblue;
            text-decoration:underline deepskyblue;
        }
        .no6{
            color: red;font-size: 25px;
        }
        .no7{
            color: red;
        }
    </style>
</head>
<body>
    <img src="C:\Users\Lenovo\Desktop\VS Code/作业素材.jpg" align="left" hspace="30">
   <h2> Web前端开发工程师</h2>
<p class="no1" >技术要求：</p>
<p class="no2">
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;了解常用的一些JS框架，如jQuery、YUI等；掌握最基本的JavaScript计算方法编写；
对目前互联网流行的网<br>页制作方法（Web2.0）HTML+CSS，以及各大浏览器兼容性有较多的了解；基本掌握前沿技术（HTML5+CSS3)。
<span class="no5"><em>Web前端技术 </em></span>你究竟掌握了多少...</p>
<p class="no3">更新时间：2015年05月19日20点（已有<span class="no6"> <strong>323</strong></span> 人点赞）</p>
<hr>
<p class="no4">相关技术文章 <span class="no7"><strong>8</strong></span> 篇</p>
</body>
</html>