前端研发入门干货之HTML
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">#博学谷IT学习技术支持#</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>先从HTML入门啦。以下是<span style="color: black;">1星期</span>就<span style="color: black;">能够</span><span style="color: black;">把握</span>的HTML知识总结~</p>
<h3 style="color: black; text-align: left; margin-bottom: 10px;">1.什么是HTML？</h3>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML全<span style="color: black;">叫作</span>Hyper Text Markup Language，即“超文本标记语言”，“超文本”既指它超越了文本的限制，又指的是超链接文本，而标记语言其实<span style="color: black;">便是</span>一种标记标签。</p>
<h3 style="color: black; text-align: left; margin-bottom: 10px;">2.HTML是做什么用的？</h3>
<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>把一个网页分为三个部分：结构（structure）、表现（presentation）、<span style="color: black;">行径</span>（behavior）。结构<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><span style="color: black;">经过</span>HTML、CSS、Javascript来实现。<span style="color: black;">因此</span><span style="color: black;">咱们</span>将结构写入HTML文件中，将表现写入CSS文件中，将<span style="color: black;">行径</span>写入Javascript文件中。</p>
<h3 style="color: black; text-align: left; margin-bottom: 10px;">3.常用的HTML标签总结</h3>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">HTML<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>的（单标签）。</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;"><html></html>根标签</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><head></head>头部</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><title></title>标题</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><body></body>主体</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">ctrl+/添加注释</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic2.zhimg.com/80/v2-91f54b859519faf23c79e912fc464149_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;">排版标签：</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><h1>---<h6>标题标签</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><p>段落标签</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><br/>换行标签</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong>/<b>加粗</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><em>/<i>倾斜</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><del>/<s>删除线</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><ins>/<u>下划线</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><img>图像标签</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic3.zhimg.com/80/v2-0cad0267ab37ad02801928f7d5a6c16e_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;"><audio>音频标签</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><video>视频标签</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><a>链接标签</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic4.zhimg.com/80/v2-212e3040d0e1c5592f53c6896e3d9027_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;"><dl>自定义列表整体<dt>自定义列表主题<dd>自定义列表每一项内容</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><ul><span style="color: black;">没</span>序列表<ol>有序列表<li>列表的每一项</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><table>表格整体<caption>表格大标题<th>表头<tr>表格每行<td>表格单元格</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><input>属性值：text文本框、password<span style="color: black;">暗码</span>框、radio单选框、checkbox多选框、file文件<span style="color: black;">选取</span>、submit提交按钮、reset重置按钮、button普通按钮</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic2.zhimg.com/80/v2-11088f54350855f982ed84ce34c08449_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;"><select>下拉菜单<option>每一项</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><textarea>文本域标签（属性cols宽度，rows可见行数）</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">没</span>语义的布局标签<div><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>！下周继续总结CSS~</p>
“BS”（鄙视的缩写） 你的话语真是温暖如春，让我心生感激。
页:
[1]