HTML超文本标记语言

目录

  • head内常见标签
  • body内常见标签
  • 基本标签
  • 常见标签
  • 特殊符号
  • 列表标签
  • 表格标签
  • form表单标签
img

head内常见标签

title
style
内部可以直接书写css代码调节html样式
但是严格来说不同语言应存放在不同的文件夹内
link
通过href参数引入外部css文件
script
内部可以直接书写js代码
也可以通过src参数引入外部的js文件
meta
定义网页源信息
1.参数description
  定义网站的简介
2.参数keyword
定义用户可能搜索到的关键字 增加网页被搜索到底的概率
img

body内常见标签

#前提
html标签分为两大类
1.行内标签	(b s u i) 
自身文本多大就占多大
2.块儿级标签 (h p) 
标签独占一行


html标签针对标签个数也有分类
1.双标签
有头有尾<h1></h1>
2.自闭和标签
有头<hr>


#<!--标题系列-->
    <h1>一级标题</h1>
    <h2>二级标题</h2>
    <h3>三级标题</h3>
    <h4>四级标题</h4>
    <h5>五级标题</h5>
    <h6>六级标题</h6>
    没有标签包裹的文本
    没有标签包裹的文本
    没有标签包裹的文本
#<!--加粗 斜体 下划线 删除线-->
    <b>加粗</b>
    <i>斜体</i>
    <u>下划线</u>
    <s>删除线</s>
#<!--段落标签-->
    <p>xxx111</p>
    <p>yyy222</p>
    <p>zzz333</p>
#<!--水平线 换行-->
    <hr>
    <br>

特殊符号

#<!--特殊符号-->
    a &gt;(>) b
    a &lt;(<) b
    何处望神州满眼&nbsp;(空格)风光北固楼天下兴亡多少事
    &yen;   人民币
    &copy;  版权
    &reg;   商标	
    &amp;   特殊&符

常见标签之a链接标签

<a href='https://www.baidu.com'>百度</a>
#href参数
1.放网址点击可以直接跳转
2.锚点功能
  放其他标签的id值点击就可以跳转到对应的标签位置
    
    
#target参数
 控制跳转页面是在当前页还是新建页
  _self
  _blank

标签两大重要属性

1.id值
类似于标签的身份证号码 在同一个html文件内 id值不能重复
    	<a id='d1'></a>

2.class值
类似于标签的群体号码 多个标签可以属于一个群体 多个标签也属于多个群体
    	<a class='c1'></a>
        <a class='c1 c2'></a>

常见标签之img图片标签

<img src='123.jpg'/>
#src参数
 1.可以放网络图片的地址
 2.也可以放本地图片的地址

#title参数
鼠标悬浮在图片上之后可以展示的文字信息

#alt参数
图片由于某些原因加载不出来的时候可以提示的文字信息

#width、height参数
调节图片的长宽 默认调节一个就可以 另外一个等比例缩放
如果两个都调节那么可能会出现图片失真的情况

常见标签之列表标签

# 1.无序列表
	<ul>
        <li>小李</li>
        <li>小明</li>
        <li>小红</li>
    </ul>
    """总结:页面上看似有规则的横向或者竖向一次排列的标签大概率都是无序列表"""

# 2.有序列表
	<ol type='A'>
        <li>小李</li>
        <li>小明</li>
        <li>小红</li>
	</ol>

# 3.标题列表
	<dl>
        <dt>标题1</dt>
        <dd>内容1</dd>
        <dt>标题2</dt>
        <dd>内容1</dd>
        <dd>内容2</dd>
    </dl>

常见标签之table表格标签

<table>
	<thead>
    	<tr>  # 一个tr就代表一行
            <th>序号</th>  # th加粗的文本
            <th>姓名</th>
            <th>年龄</th>
		</tr>
    </thead>  # 表头(字段名称)
	<tbody>
    	<tr>
            <td>1</td>  # td普通文本
            <td>jason</td>
            <td>18</td>
		</tr>
    </tbody>  # 表单(数据部分)
</table>
img

常见标签之form表单

#前提:该标签可以接受用户的数据并发送给后端服务器
获取用户数据的标签最为常见的就是input标签
并且获取用户数据的标签最好都要有一个name属性用来表示该数据到底是用户的什么数据

type参数
 text
 password
 date
 email
 radio
 checkbox
 file
 button  # 没有任何作用
 reset  # 重置
 submit  # 触发提交数据的动作


#select标签
 下拉选择
    
#textarea标签
 大文本
img
posted @ 2021-08-02 14:59  陌若安然  阅读(122)  评论(0)    收藏  举报