HTML（总）

最新推荐文章于 2024-08-12 16:19:20 发布

hbx_Ambition

最新推荐文章于 2024-08-12 16:19:20 发布

阅读量229

点赞数

分类专栏：自学笔记文章标签： css html 前端

本文链接：https://blog.csdn.net/hbx_Ambition/article/details/123671402

版权

本文是HTML5的基础教程，涵盖了HTML的基本结构、标签属性、字符编码、文档声明、以及一些常见的标签如标题、段落、图片、链接、表单等的使用方法。通过实例代码展示，帮助初学者理解HTML5的基本语法和特性。

摘要由CSDN通过智能技术生成

Web前端--HTML5

<html></html>

-开头基本上都是成对存在的结尾的用/来区分
<head></head>

-其次头里面有设置标题的

--<title>里面输入你想要的内容</title>

<body></body>

-和head属于并列是网页的内容

--其中<h1></h1></h1>一级标题以此类推 <p>用来表示段落</p>

代码如下：

 <html>
     <head>
         <title></title>   
      <head>
      <body>
          <h1></h1>
          <p></p>
       <body>
 </html>

 <table>
     <tr>
         <td colspan="2"></td>
         <td></td>
     </tr>
     <!-- 表示一行二列 -->
     <tr>
         <td rowspan="2"></td>
         <td></td>
     </tr>
 </table>

 <video src=""  controlsautopaly ></video>
 <audio src="" controls autoplay></audio>

 <header></header>
 <section></section>
 <footer></footer>

 <!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <title>内联框架学习</title>
 </head>
 <body>
 <!--<iframe src="//player.bilibili.com/player.html?aid=6159200&bvid=BV11s41167h6&cid=10001692&page=1"-->
 <!--        scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true">-->
 <!--</iframe>-->
 
 <iframe src="https:/www.baidu.com" frameborder="0" width="1000px" height="800px"></iframe>
 <!--iframe 内联框架
 src：地址
 w-h：宽度高度
 
 -->
 <iframe src=""  name=“hello” frameborder="0" width="1000px" height="800px"></iframe>
 <a href="https://blog.kuangstudy.com" target="hello">点击跳转</a>
 </body>
 </html>

 <!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <title>图像学习标签</title>
 </head>
 <body>
 <!--img 学习
 src 图片地址 必填
 ../  --上一级目录
 alt:图片名字必填
 -->
 <img src="../resources/image/mmexport1644734874662.jpg" alt="rose" title="悬停文字" width="300" height="300">
 <a href="链接标签.html#down">跳转</a>
 
 <!--功能性链接
 邮件链接:mailto;
 qq链接：
 
 
 -->
 <a href="mailto:465230710@qq.com">点击来联系我们</a>
 <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=&site=qq&menu=yes">
     <img border="0" src="http://wpa.qq.com/pa?p=2::53" alt="你好，有问题联系我" title="你好，有问题联系我"/>
 </a>
 </body>
 </html>

get：可以在url中看到，高效但是不安全

 <p>名字：<input type="text" name="username" placeholder="请输入用户名" required ></p>
 <!--密码 input type="pwd"-->
 <p>密码：<input type="password" name="pwd" hidden value="123456"></p>

 <!--  单选框标签
   input type=“radio”
   value：表示单选框的值
   name：表示组
   -->
     <p>性别：
     <input type="radio" value="boy" name="sex" checked disabled/>男
     <input type="radio" value="gril" name="sex"/>女
 
     </p>

 <!-- 多选框   -->
     <p>爱好：
         <input type="checkbox" value="sleep" name="hobby">睡觉
         <input type="checkbox" value="code" name="hobby" checked>敲代码
         <input type="checkbox" value="chat" name="hobby">聊天
         <input type="checkbox" value="game" name="hobby">游戏
     </p>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单学习</title>
</head>
<body>
<h1>注册</h1>
<!--表单 form
action:表单提交的位置，可以是网站也可以是一个请求处理地址
method:post get 提交方式
get方式提交：我们可以在url中看到我们提交的信息不安全，高效
post：比较安全，传输一个大的文件
-->
<from action="5.列表标签.html" method="post">
<!-- 文本输入框 ：input type="text"
value="韩博轩真帅" 默认初始值
 maxlength="8" 最长能写几个字符
  size="30"    文本框的长度
  -->
<p>名字：<input type="text" name="username" placeholder="请输入用户名" required ></p>
<!--密码 input type="pwd"-->
<p>密码：<input type="password" name="pwd" hidden value="123456"></p>
<!--  单选框标签
  input type=“radio”
  value：表示单选框的值
  name：表示组
  -->
    <p>性别：
    <input type="radio" valu

最低0.47元/天解锁文章

hbx_Ambition

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML（总）

Web前端--HTML5 <html></html> -开头基本上都是成对存在的结尾的用/来区分 <head></head> -其次头里面有设置标题的--<title>里面输入你想要的内容</title> <body></body> -和head属于并列是网页的内容--其中<h1></h1></h1>一级标题以此类推 <..
复制链接

扫一扫