HTML基础

最新推荐文章于 2024-07-15 15:35:16 发布

---3

最新推荐文章于 2024-07-15 15:35:16 发布

阅读量112

点赞数 1

分类专栏： HTML 文章标签： html

本文链接：https://blog.csdn.net/adan_v_/article/details/112751095

版权

HTML 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

HTML基础格式

我写的第一个博客

我写的第一个博客

现在是一名大一大数据学生，准备在四年间记录一下我的学习内容。这篇博客是对HTML粗糙的笔记整理，摘自b站的一位up主。另附上补充资料网址https://developer.mozilla.org/ en-US/docs/Web/HTML/Attributes

https://developer.mozilla.org/ en-US/ docs/Web/HTML/

Global_ attributes

基本框架

<DOCTYPE.html>
    <html>/*开头*/
        <head>
            <title>。。。。。。</title>
        </head>/*网页标题名称*/
       
        <body>/*网页内容*/
           <h1>....</h1>/*一级标题*/
           <h2>....</h2>/*二级标题*/
           <p>.....</p>/*段落正文内容*/
        </body>
   </html>/*结尾*/

tag类型

块级元素

在页面以块的形式展现
出现在新的一行
占全部宽度

<p>
<h1-h6>
<div>

内联元素
1.通常在块级元素内
2.不会导致文本换行
3.只占必要的部分宽度

<a href="xxxx网址" target="-blank">。。链接字词</a>/*href超链接网址 target 另开新页面*/
<strong>....</strong>/*加粗*/
<em>....</em>/*斜体*/

创建一个list

无序list

在网页上显示
显示效果

有序list

<ol>
 <li>List Item 1</li>
 <li>List Item 2</li>
 <li>List Item 3-/li>
 <li>List Item 4</li>
 <li>List Item 5</li>
</ol>

在网页上显示
在这里插入图片描述

创建一个table

表头，表格内容，表格的颜色等设计还需要CSS

  <table>
       <thead>/*表头*/
              <tr>/*横向排列内容*/
                  <th>姓名</th>/*输入表格内容*/
                  <th>性别</th>
                  <th>儿童</th>
                  <th>数量</th>
               </tr>
      </thead>
       
      <tbody>/*表格内容*/
             <tr>
                 <td>小张</td>/*表中内容*/
                  <td>男</td>
                   <td>  </td>
                    <td>1</td>
             </tr>
      </tbody>
  </table>

显示结果在这里插入图片描述

创建一个form

基本格式

<form>/*表单*/
    <div>/*区块*/
         <label>姓名</label>/*表头名字*/
         <input type="text" name="First name" placeholder="enter">/*type类型  name提交后端显示名称   placeholder  框内提示*/
    </div>
           
    <div>
         <label>Email</label>
         <input type="email" name="email" placeholder="email">
   </div>/*email的type为email*/
           
   <input type="submit" name="submit"
   value="submit">/*submit的写法*/
</form>

提交form到后台文件

<form action="文件名" method="POST">.\/*表单提交方式通用post*/

显示效果

在这里插入图片描述

快捷键

Alt+shift+下快速复制
Ctrl+? 注释分割
br 空行
hr 分割线
Ctrl+s 保存

显示图片

<img src="图片链接地址或保存至index中img/名称.jpg" alt="当无法找到该图片时显示文字">

引用文字

<blockquote>相当于p的功能</blockquote>

添加注释

 <p><abbr title="a big college">MIT</abbr> is a college</p>/*title注释内容 abbr添加注释 要把注释的词放在abbr里*/

引用名言自带格式

自带斜体格式

<p><cite>句子</cite></p>

---3

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
HTML基础

HTML基础格式我写的第一个博客基本框架tag类型创建一个list创建一个table创建一个form快捷键显示图片引用文字添加注释引用名言自带格式我写的第一个博客现在是一名大一大数据学生，准备在四年间记录一下我的学习内容。这篇博客是对HTML粗糙的笔记整理，摘自b站的一位up主。另附上补充资料网址https://developer.mozilla.org/ en-US/docs/Web/HTML/Attributeshttps://developer.mozilla.org/ en-US/ docs/
复制链接

扫一扫