HTML基础知识

1.html文件结构

61c0eab897664844a09e764d603fa315.png

 

<title> 元素描述了文档的标题

<body> 元素包含了可见的页面内容

2.html 标签

h1-h6 这是标题标签 双标签

并且 <h1> </h1> 标签最大

<h6> </h6> 标签最小

段落标签

<p> </p > 也是双标签

下划线

<hr /> 单标签

换行

<br /> 单标签

下面是演示成果bc5a2bb71fed4b18b000503e4ab06f55.png

8c7bc0e9b15f4b52b472b27693663936.png 

 

超链接 a标签 双标签

链接的地址在 href 属性中指定:

后面要加 https://

图片标签 img 单表签

后面要加 src 属性

后面跟上照片的路径 包括绝对路径 或者相对路径

绝对路径:指目录下的绝对位置,可直接到达目标位置,通常从盘符开始的路径

相对路径有哪三种情况:• 同级目录:直接写:目标文件名字!• 下级目录:直接写:文件夹名/目标文件名字!• 上级目录:直接下:../目标文件名字!

演示成果6a5f4e7c90544957851f622e9d8225e8.png

611134e7be35493998aa6f62229cfe2a.png 

 

div区域 常结合CSS设置属性

表格 table

每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义),表格可以包含标题行(<th>)用于定义列的标题。784543947a99485ab8a1d8d8a1e4be8b.png

a30f538785bc47be86f2031abe3c1b0f.png 

 

无序列表

无序列表使用 <ul> 标签 和<li> </li>标签9b17d0d093914919aaa111887eb60b44.png

cc5a5889677d4d1dbfdd8fd310508699.png 

 

有序列表

序列表始于 <ol> 标签。每个列表项始于 <li> 标签。

列表项使用数字来标记。4a5be957fe424e40891d649829bf5744.png

2b90cf750133495989ffd90420912560.png 

 

表单

<form> 元素用于创建表单,action 属性定义了表单数据提交的目标 URL,method 属性定义了提交数据的 HTTP 方法(这里使用的是 "post")。

<label> 元素用于为表单元素添加标签,提高可访问性。

<input> 元素是最常用的表单元素之一,它可以创建文本输入框、密码框、单选按钮、复选框等。type 属性定义了输入框的类型,id 属性用于关联 <label> 元素,name 属性用于标识表单字段。

<select> 元素用于创建下拉列表,而 <option> 元素用于定义下拉列表中的选项。

<form action="">

   账户: <input type="text" name="userName">

    <br>

   密码: <input type="password" name="password">

    <!-- textarea 标签定义一个文本区域 password 定义密码框-->这里 当type 是text类型时 是文本框

当 type 是password 类型是 是密码框

 

 

<input type="submit" value="提交">

<input type="reset" value="重置"><input type="submit" value="提交">

当type 是submit时是 提交按钮

<input type="reset" value="重置">

当type 是reset时是 重置按钮

 

 

<form action="">

    性别:

    男 <input type="radio" value="boy" name="sex" checked>

    <!-- checked 默认选中 -->

    女 <input type="radio" value="gril" name="sex">

 

    <br>

    爱好:

    <input type="checkbox" value="1" name="music" checked> 音乐

    <input type="checkbox" value="2" name="sport">体育

    <input type="checkbox" value="3" name="reading"> 阅读

 

</form>单选框 radio

checked 默认值

复选框 checkbox

 

 

下拉列表 select option

<select name="" id="">

  <option value="">选项1</option>

  <option selected>选项2</option>

  <!--selected属性表示默认选中该选项-->selected 默认选项

文本域 textarea

  • 42
    点赞
  • 27
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值