首页 › CSS论坛 › HTML+CSS学习

最右爱的人 發表於 2021-1-15 21:47:00

HTML+CSS学习

<p></p><div class="toc"><div class="toc-container-header">目录</div><ul><li>HTML+CSS3学习</li><li>一、导读<ul><li>1.网页</li><li>2.常用浏览器</li><li>3.Web标准<ul><li>3.1.为什么需要Web标准</li><li>3.2.Web标准的构成</li></ul></li></ul></li><li>二、HTML标签（上）<ul><li>1.HTML语法规范</li><li>2.HTML基本结构标签</li><li>3.开发工具</li><li>4.HTML常用标签<ul><li>4.1.标签语义</li><li>4.2.标题标签"h1至"h6"（重要）</li><li>4.3.段落标签和换行标签（重要）<ul><li>4.3.1.段落标签</li><li>4.3.2.换行标签</li></ul></li><li>4.3.案例</li><li>4.4.文本格式化标签</li><li>4.5.div标签和span标签</li></ul></li><li>5.HTML中的注释和特殊字符</li></ul></li></ul></div><p></p>
<h1 id="htmlcss3学习">HTML+CSS3学习</h1>
<h1 id="一导读">一、导读</h1>
<h2 id="1网页">1.网页</h2>
<h2 id="2常用浏览器">2.常用浏览器</h2>
<h2 id="3web标准">3.Web标准</h2>
<h3 id="31为什么需要web标准">3.1.为什么需要Web标准</h3>
<h3 id="32web标准的构成">3.2.Web标准的构成</h3>
<ul>
<li>结构：HTML</li>
<li>表现：CSS</li>
<li>行为：JavaScript</li>
</ul>
<h1 id="二html标签上">二、HTML标签（上）</h1>
<h2 id="1html语法规范">1.HTML语法规范</h2>
<ol>
<li>
<p>所有标签都在<code>&lt;&gt;&lt;/&gt;</code>中。大多标签是成对出现的。如：<code>&lt;a&gt;&lt;/a&gt;</code></p>
</li>
<li>
<p>标签关系</p>
<ul>
<li>
<p>包含</p>
</li>
<li>
<p>并列</p>
</li>
</ul>
</li>
</ol>
<h2 id="2html基本结构标签">2.HTML基本结构标签</h2>
<pre><code class="language-html">&lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>
<p><img src="https://img2020.cnblogs.com/blog/1387615/202101/1387615-20210115214823612-321000608.png"></p>
<h2 id="3开发工具">3.开发工具</h2>
<ul>
<li>DreamWeaver：下载</li>
<li>sublime：下载</li>
<li>WebStom：下载</li>
<li><strong>VSCode</strong>：最常用的开发工具，下载
<ul>
<li>
文档类型声明
</li>
<li>lang：语言（en:英语；zh-CN；中文）</li>
<li><code>&lt;meta charset="UTF-8"/&gt;</code>：编码方式</li>
</ul>
</li>
</ul>
<h2 id="4html常用标签">4.HTML常用标签</h2>
<h3 id="41标签语义">4.1.标签语义</h3>
<p>理解标签是做什么用的。</p>
<p>作用：可以使页面结构更清晰。</p>
<h3 id="42标题标签h1至h6重要">4.2.标题标签"h1至"h6"（重要）</h3>
<ul>
<li>一共<strong>6</strong>标题</li>
<li>标题独占一行（行标签）</li>
</ul>
<h3 id="43段落标签和换行标签重要">4.3.段落标签和换行标签（重要）</h3>
<h4 id="431段落标签">4.3.1.段落标签</h4>
<pre><code class="language-html">&lt;p&gt;这是一个段落标签&lt;/p&gt;
</code></pre>
<h4 id="432换行标签">4.3.2.换行标签</h4>
<pre><code class="language-html">&lt;br/&gt;//break
</code></pre>
<p>学到的第一个单标签</p>
<h3 id="43案例">4.3.案例</h3>
<h3 id="44文本格式化标签">4.4.文本格式化标签</h3>
<ol>
<li><strong>粗体</strong>
<ol>
<li><code>&lt;strong&gt;优先使用&lt;/strong&gt;</code></li>
<li><code>&lt;b&gt;&lt;/b&gt;</code></li>
</ol>
</li>
<li><em>斜体</em>
<ol>
<li><code>&lt;em&gt;优先使用&lt;/em&gt;</code></li>
<li><code>&lt;i&gt;&lt;/i&gt;</code></li>
</ol>
</li>
<li><ins>下划线</ins>
<ol>
<li><code>&lt;ins&gt;优先使用&lt;/ins&gt;</code></li>
<li><code>&lt;u&gt;&lt;/u&gt;</code></li>
</ol>
</li>
<li><s>删除线</s>
<ol>
<li><code>&lt;del&gt;优先使用&lt;/del&gt;</code></li>
<li><code>&lt;s&gt;&lt;/s&gt;</code></li>
</ol>
</li>
</ol>
<h3 id="45div标签和span标签">4.5.div标签和span标签</h3>
<h2 id="5html中的注释和特殊字符">5.HTML中的注释和特殊字符</h2><br><br>
来源：https://www.cnblogs.com/yanying521/p/14284409.html

查看完整版本: HTML+CSS学习