美文网首页
HTML基础学习——图片与列表

HTML基础学习——图片与列表

作者: 思君_4cd3 | 来源:发表于2019-08-10 22:11 被阅读0次

一.HTML图片的基本使用

  • <img src="URL地址" alt="图片的替代文本“/>
    但标签,有两个属性。

示例代码:


代码1
结果1
1.设置图片的尺寸
1.width和height属性

图片本身没有变化,只是在网页显示的时候改变。


代码如下
结果显示
2.设置图片链接

当点击图片时,会跳转到另一个网页。


代码
图片显示
跳转显示

二.列表

1.列表的三种形式

1.无序列表
2.有序列表
3.自定义列表

1.无序列表
  • <ul>和<li>


    代码
    结果
2.有序列表
  • <ol>和<li>


    代码示例
    结果
3.自定义列表
  • <dl> <dt> <dd>

<dl> 标签定义了定义列表(definition list)。
<dt> 标签定义了定义列表中的项目(即术语部分)。
<dd> 在定义列表中定义条目的定义部分。


代码示例
结果
2.列表的嵌套
代码示例
结果
3.列表中使用超链接

点击链接时直接跳转到当前网站。


代码如下
结果

(此文章仅作为个人学习笔记使用,如有错误欢迎指正~)

相关文章

  • HTML基础学习——图片与列表

    一.HTML图片的基本使用 但标签,有两个属性。 示例代码: 1.设置图片的尺寸 1.width和height属性...

  • 初识HTML

    HTML基础 文本标签 列表 图片和超链接 表格 homework.html

  • 2018-08-13day-21

    HTML web基础 添加文本 列表 图片和超链接 表格 复杂表格

  • SVG 简介

    基础 学习SVG之前需要掌握: HTML 与 XMLSVG参考手册:SVG元素列表 SVG 指可伸缩矢量图形 (S...

  • 第二阶段 Day1 HTML基础

    01.web基础 02.文本标签 03.列表 04.图片和超链接 05.表格 06.复杂的表格 01.HTML基础...

  • 01-HTML基础

    学习内容: 1 HTML概念 2 HTML发展史 3 基础语法 4 常用标签(段落、图片、标签) 1.HTML是什...

  • HTML基础 之 表格 与 列表

    HTML的表格 概述: 表格由 标签来定义。每个表格均有若干行(由 标签定义),每行被分割为若干单元格(由...

  • ## HTML基础-列表标签/表格标签

    ## HTML基础-列表标签/表格标签 # 列表标签(无序列表/有序列表/定义列表) # 表格标签 # 单元格合并...

  • react学习路线图

    基础 HTML学习 HTML 基础学习 HTML 基础CSS学习 CSS 基础在上一步练习的基础上为页面添加样式使...

  • HTML基础之列表

    首先我们来明确一下我们的任务,我们需要用HTML列表的知识做出一个如图1.1的列表。 这个列表我们分三个步骤完成。...

网友评论

      本文标题:HTML基础学习——图片与列表

      本文链接:https://www.haomeiwen.com/subject/oalzdctx.html