HTML基础入门|青训营笔记

122 阅读2分钟

今天是HTML基础入门笔记,简单大致介绍一下HTML,后期会再次学习的,学有余力的同学可以根据自己的进度展开学习。

认识各类基础标签

加粗 加粗: /b><br 最常用的是 strong

倾斜 倾斜:em最常用的是i

删除线删除线
: del

下划线下划线
 :ins

块级标签
:div,行级标签可以独占一行

行内标签 :span块级标签同行可以放多个,不能居中

<img src="" alt=""> 插入图片,在src里放图片路径,"./"列出当前列表内容,"../列出上一级内容"

<a href="">链接 链接,在href里写链接跳转的地址(路径),两个a括号之间写链接显示名字

<a href="#12">锚点链接 锚点链接,可以跳转到网页的某一处,在href里写 "#id",再在目的地那行写上"id= "

 emsp是全角空格,占据宽度正好是一个中文字体的宽度,基本不受字体变化影响.

 nbsp半角空格,受字体影响较大.

 ensp大概二分之一字体大小,基本不受字体影响.

header:头部标签

nav:导航标签

article:内容标签

section:定义文档某个区域

aside:侧边栏标签

footer:尾部标签

base target="_blank"设置整个页面的链接开启方式为打开一个新窗口,此命令写在head当中

table:表格

caption:表格的标题标签

        1.caption只跟表格搭配使用,可以居中

        2.tr生成于表格的一行

        3.th填写文字的地方,写一个th就是一格标题,加粗居中

</tr>
        <tr>
            <td>内容</td>填写文字的地方
            <td>内容</td>填写文字的地方
        </tr>
    </table>

ul无序列表

1.li:无序列表格,排列出来的前面有个点(可取消) 2.ol有序列表 3.dl自定义列表

  <dt>标题</dt>自定义列表标题
        <dd>内容</dd>自定义列表内容
    </dl>

input type="text":text输入框,单标签

input type="password":password密码框,输入时隐藏密码

input type="radio" name="xxx": radio单选,相同name的只能选择一个

input type="radio" name="xxx" checked: checked,进入网页时自动默认选中

input type="checkbox" name="xxx": checkbox多选,相同name的可以多选

input type="text" placeholder="未输入时默认显示的内容": placeholder未输入时默认显示的内容

id="#" 要联动的图片或者文字>增加用户体验,点同一个id 的label设置的图文可联动

input type="button" value="普通按钮"
 点了也不会提交,后期配合js使用

input type="submit" value="提交按钮"
submit是提交按钮,要配合form表单域使用

input type="image" src="imges/sub-btn.jpg"
image是图片按钮,必须要有src属性来找图片位置,也要配合form表单域提交

button点击按钮button是双标签,可以直接提交

textarea placeholder="文本域" textarea是一个文本域,用来显示文字/

select下拉列表

option1下拉内容

option2下拉内容

option3下拉内容

基础完