学习笔记篇——HTML

(一)HTTP大概

  1. 对于中文网页需要用声明编码,否则会出现乱码,有些浏览器会设置GBK为默认编码,需设置

  2. 元素解析(起始标记为<…> 终止标志为</…>)

    • “声明为HTML5文档

    • ““元素是HTML页面的根元素(详情了解根元素点击这-根元素)

    • ““ 元素包含文档元(meta)数据

    • “ 元素描述文档标题</p> </li> <li><p>“<body>“ 元素包含可见页面的内容 </p> </li> <li><p>“<h1>“ 元素定义一个大标题</p> </li> <li><p>“<p>“ 元素是段落 </p> </li> </ul> </li> </ol> <p>3 . HTML意思是超文本<u>标记语言</u><br> * <u>HTML标签通常成对出现</u>,(写的时候还是一对对的写好点)。<br> * doctype是不区分大小写的<br>4 . 一个网页的大概框架为 </p> <pre class="language-<html>" data-language="<html>"><code class="language-<html>"><head> <title>...<title> </head> <body> <h1>...</h1> <p>...</p> </body> </html> </code></pre> <ol start="5"> <li>plus:<pre class="language-<html>" data-language="<html>"><code class="language-<html>"><head> <title>...<title> </head> <body> <header> </header> <nav> </nav> <h1>...</h1> <p>...</p> </body> </html> </code></pre> 6 . 头部信息放在<head></head>之间,这部分内容包括<title>,<base>,<link>,<style>,<script>,<meta>。设置网页定时跳转:<u><meta http-equiv="refresh" content="秒 "url="资源途径"/></u><br>7 . HTML图形是通过<img>定义,如<code loading="lazy"><img loading="lazy" src="/images/;ogo.png" width="258" height="39"></code><br>8 . 注释的表达<code><!-- 这是一个注释 ---></code> ,换行是<br /> , 水平线是<hr /><br>9 . <b>标记含义是加粗(感觉和<strong>也没什么区别),<i>标记意思是斜体(感觉和<em>也没什么区别)<br>10 . <small>标记将旁注呈现为小型文本,免责声明,注意事项均属于这<br>12 . 上标为<sup>,下标为<sub><br>13 . CSS背景色属性为(background-color),字体(font-family),颜色(color),字体大小(font-size)文字(text-align)<br>14 . </li> </ol> </div><ul class="post-copyright"><li class="post-copyright-author"><strong>Post author: </strong>chenwenyu</li><li class="post-copyright-link"><strong>Post link: </strong><a href="https://avereed.github.io/2021/09/22/%E5%AD%A6%E4%B9%A0%E8%AE%B0%E5%BD%95/" title="学习记录">https://avereed.github.io/2021/09/22/%E5%AD%A6%E4%B9%A0%E8%AE%B0%E5%BD%95/</a></li><li class="post-copyright-license"><strong>Copyright Notice: </strong>All articles in this blog are licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.zh" target="_blank" rel="noopener" title="CC BY-NC-SA 4.0 "><svg class="icon"><use xlink:href="#icon-creative-commons-line"></use></svg><svg class="icon"><use xlink:href="#icon-creative-commons-by-line"></use></svg><svg class="icon"><use xlink:href="#icon-creative-commons-nc-line"></use></svg><svg class="icon"><use xlink:href="#icon-creative-commons-sa-line"></use></svg></a> unless otherwise stated.</li></ul></section></article><div class="post-nav"><div class="post-nav-item"><a class="post-nav-prev" href="/2021/09/30/Java%E5%AD%A6%E4%B9%A0/" rel="prev" title="Java学习"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-arrow-left-s-line"></use></svg><span class="post-nav-text">Java学习</span></a></div><div class="post-nav-item"><a class="post-nav-next" href="/2021/09/22/%E7%BD%91%E9%A1%B5%E5%88%B6%E4%BD%9C/" rel="next" title="网页制作"><span class="post-nav-text">网页制作</span><svg class="icon" aria-hidden="true"><use xlink:href="#icon-arrow-right-s-line"></use></svg></a></div></div></div><div class="hty-card" id="comment"><div class="comment-tooltip text-center"><span>要不要和我说些什么?</span><br></div></div></main><footer class="sidebar-translate" id="footer"><div class="copyright"><span>© 2021 – 2022 </span><span class="with-love" id="animate"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-cloud-line"></use></svg></span><span class="author"> chenwenyu</span></div><div class="powered"><span>Powered by <a href="https://hexo.io" target="_blank" rel="noopener">Hexo</a> v5.4.0</span><span class="footer-separator">|</span><span>Theme - <a rel="noopener" href="https://github.com/YunYouJun/hexo-theme-yun" target="_blank"><span>Yun</span></a> v1.6.2</span></div><div class="live_time"><span>本博客已萌萌哒地运行</span><span id="display_live_time"></span><span class="moe-text">(●'◡'●)</span><script>function blog_live_time() { setTimeout(blog_live_time, 1000); const start = new Date('2021-09-19T00:00:00'); const now = new Date(); const timeDiff = (now.getTime() - start.getTime()); const msPerMinute = 60 * 1000; const msPerHour = 60 * msPerMinute; const msPerDay = 24 * msPerHour; const passDay = Math.floor(timeDiff / msPerDay); const passHour = Math.floor((timeDiff % msPerDay) / 60 / 60 / 1000); const passMinute = Math.floor((timeDiff % msPerHour) / 60 / 1000); const passSecond = Math.floor((timeDiff % msPerMinute) / 1000); display_live_time.innerHTML = " " + passDay + " 天 " + passHour + " 小时 " + passMinute + " 分 " + passSecond + " 秒"; } blog_live_time(); </script></div></footer><a class="hty-icon-button" id="back-to-top" aria-label="back-to-top" href="#"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-arrow-up-s-line"></use></svg><svg class="progress-circle-container" viewBox="0 0 100 100"><circle class="progress-circle" id="progressCircle" cx="50" cy="50" r="48" fill="none" stroke="#0078E7" stroke-width="2" stroke-linecap="round"></circle></svg></a><script>const date = new Date(); const today = (date.getMonth() + 1) + "-" + date.getDate() const mourn_days = ["4-4"] if (mourn_days.includes(today)) { document.documentElement.style.filter = "grayscale(1)"; }</script></div></body></html>