当前位置: 代码迷 >> 综合 >> 前端HTML5基础最终总结笔记(1)简单明了
  详细解决方案

前端HTML5基础最终总结笔记(1)简单明了

热度:41   发布时间:2023-12-03 07:36:17.0

标签:

标题标签:<h1> ~ <h6>

                  <h1> </h1>

段落标签:<p> </p>

换行标签:<br/>

文本格式化标签: 加粗<strong></strong>(语义更强烈,推荐)或者<b> </b>

                              倾斜:<em></em>(推荐)或者<i> </i>

                              删除:<del></del>(推荐)或者<s></s>

                             下划线:<ins> </ins>(推荐)或者<u> </u>

<div>(小盒子) 与<span>(大盒子)标签

:就是两个装内容的盒子,没有语义

一行可以放多个<span>

但是一行只能放一个<div>

图片标签与路径

<img src="图像URL"/>

图像标签的属性:

属性
src 图片路径
alt 替换文本
title 提示文本
width 图像宽度
height 图像长度
border 图像边框粗细

超链接标签:<a href="跳转目标" target="_blank"> </a>

                  target 打开窗口的方式 默认的值是_self   当前窗口打开页面

                  _blank 新窗口打开页面

空链接:如果没有确定的地址,可以这样<a href="#">首页</a>

锚点链接:点击某个链接,可以快速定位到页面的某个位置,两步:

        (1)<a href="#two">第二季</a>

        (2)找到目标位置标签,<h3 id="two">第三季介绍</h3>

特殊字符:空格:&nbsp;为一个空格

                  小于号:&It

                  大于号:&at

表格

基本语法如下:

<table>
<tr>
<th>姓名<th>
<td>单元格内的文字</td>
...
</tr>
</table>

<table></table>是定义表格的标签,<tr></tr>为行,<td></td>为单元格,<th>为表头单元格,会加粗

表格的相关属性(写在table里面)<table align="center">:

align:对齐

border:边框

cellpadding:像素,文字和边框的距离

cellspacing:单元格和单元格之间的距离

表格结构标签例子:

   <table align="center"><thead><tr><th>排名</th><th>关键词</th><th>趋势</th><th>进入搜索</th><th>相关链接</th></tr></thead><tbody><tr><td></td><td></td><td></td><td></td><td></td></tr></tbody></table>

合并单元格

两种方式:跨行合并:rowspan="合并单元格"

                  跨列合并:colspan="合并单元格"

合并单元格三部曲:

(1)确定是跨行还是跨列合并

(2)找到目标单元格,写上合并方式=合并单元格的数量。例如:<td colspan="2">

(3)删除多余的单元格