html复习2

最新推荐文章于 2023-12-10 23:11:39 发布

吴默涵1

最新推荐文章于 2023-12-10 23:11:39 发布

阅读量2.3k

点赞数

本文链接：https://blog.youkuaiyun.com/wu964521/article/details/103323226

版权

图像标记

常用图像格式
1、GIF格式

支持动画，GIF格式也是一种无损的图像格式，也就是说修改图片以后，图片的质量没有变化，支持全透明，但GIF格式只能处理256种颜色。

2、PNG格式

包括PNG-8和真色彩PNG（PNG-24和PNG-32）。与GIF相比，PNG格式最大的优势是体积更小，支持alpha透明，颜色过度更平滑，不支持动画。

3、JPG格式

有损压缩，会造成图像数据消失，但可以保存超过256种颜色。

图像标记<img />
语法格式：

<img  src="图像  URL">

该语法中src属性用于指定图像文件的路径和文件名，他是img标记的必须属性。

<img />标记的属性

属性	描述
src	图像的路径
alt	图像不能显示时的替换文本
title	鼠标悬停时显示的内容
width	设置图像的高度
height	设置图像的高度
border	设置图像边框的宽度
vspace	设置图像顶部和底部的空白
hspace	设置图像左侧和右侧的空白

图像的替换属性文本alt

在图片无法正常显示时，显示文本解释。

超链接标记

创建超链接
HTML中创建超链接非常简单，只需要标记环绕对象即可。
语法格式：

<a href="跳转目标"  target="目标窗口弹出的方式"> 文本或图像</a>

（1）href: 用于指定连接目标的url地址，当为<a>标记应用到和href属性时，他就具有了超链接的功能。
（2）target：用于指定链接页面的打开方式，其取值有—self和—blank方式，其中—self 为默认，意为原窗口打开，—blank为在新的窗口打开。

锚点链接
通过创建锚点链接，用户能够快速定位到目标内容。
语法应用：

<a  href="#id名">连接文本</a>

例

<div  id=four>
</div>

<a  href="four"></a>

列表元素

ul元素
无序列表是网页中最常用的列表，之所以称为“无序列表”，是因为其各个列表项之间没有顺序级别之分，通常是并列的。<ul></ul>标记用于定义无序列表，<li></li>标记嵌套在<ul></ul>标记中。
例

<ul>
     <li></li>
     <li></li>
</ul>

ol元素
有序列表即为有排列顺序的列表，其各个列表项按照一定的顺序排列。
语法格式：

<ol>
    <li></li>
    <li></li>
</ol>

该元素中还拥有start属性和reversed属性，其中start属性可以更改列表编号的起始值，reversed属性表示是否对列表进行反向排序，默认值为true。

<ol   start="3"    >

ol元素
有序列表即为有排列顺序的列表，其各个列表项按照一定的顺序排列。
定义有序列表的基本语法格式：

<ol>
     <li></li>
     <li></li>
</ol>

<ol></ol>标记用于定义有序列表，该元素还拥有start元素和reversed元素。

dl元素
定义列表常用于对属于或名词进行解释和描述，与无序和有序列表不同，定义列表的列表项没有任何项目符号。
基本语法：

<dl>
     <dt>名词1</dt>
     <dd>名词解释1</dd>
      <dt>名词2</dt>
     <dd>名词解释2</dd>

</dl>

在上面语法中，<dl></dl>标记用于定义指定定义列表，<dt></dt>和<dd></dd>并列嵌套与<dl></dl>，其中<dt></dt>用于定义属于名词，<dd></dd>标记用于对名词的解释和描述。

结构元素

HTML5中所有的元素都是由结构性的，且这些元素的作用与块元素非常相似结构元素包括：header元素、nav元素、article元素。

header元素
header元素是一种具有引导和导航作用的结构元素，该元素可以包含所有常放在页面头部的内容，放置整个页面的标题和内容区块的标题。

nav元素
用于定义导航链接，是HTML5新增的元素，该元素可以将与有导航性质的链接归纳在一个区域中，使页面元素的语义更加明确。

传统导航条：目前主流网站上都有不同层级的导航条，其作用是跳转到网站的其他主页面。
侧边栏导航条：目前主流博客网站及电商网站都有侧边栏导航条，目的是将当前文章或当前商品页面跳转到其它文章或其他商品页面。
业内导航：它的作用是在本页面的几个主要的组成部分之间进行跳转。
翻页操作：翻页操作切换的是网页的内容部分，可以通过单击切换。

article元素
代表文档、页面或者应用程序中与上下文不想关的独立部分，该元素经常被应用定义一篇日志、新闻或用户评论。通常使用多个section元素进行划分。

aside元素
用来定义当前页面或者文章的附属信息部分，它可以包含与当前页面主要内容的相关引用。侧边栏，广告、导航条等其他类似的有别与主要内容的部分。
用法主要分为两种：

被包含在article元素内作为主要内容的附属信息。
在article元素之外使用，作为页面或站点全局的附属信息部分。

section元素

用于对网站或应用程序中页面上的内容进行分块，一个section元素通常由内容和标题组成。
使用section应注意：

不要将section元素用作设置样式的页面容器，那是div的特性，section元素并非一个普通的容器元素，当一个容器需要被直接定义样式或通过脚本定义行为时，推荐使用div。
如果article 元素、aside元素或nav元素更符合使用条件，那么不要使用section元素。
没有标题的内容区块不要使用section元素定义。

footer元素
用于定义一个页面或者区域的底部，他可以包括所有通常放在页面底部的内容，一般使用<div id="footer"><div/>标记来使用。

分组元素

figure元素和figcaption元素
在HTML5中，figure元素用于定义独立的流内容，一般指一个独立的单元。figure元素的内容应该与主内容有关，但如果被删除，也不会对文档流产生影响。figcaption元素用于为figure元素添加标题，一个figure元素中最多只能使用一个figcaption元素，该元素应该放在figure元素的第一个或者最后一个元素的位置。

hgroup元素

用于将多个标题组成一个标题组，通常他与h1~h6元素组合使用，通常，将hgroup元素和header元素使用。