一、列表标签

<!-- 快捷键 1、<meta charset="UTF-8"/>  用m6可直接写出

           2、复制当前1行到下一行 ctrl+shift+R   

-->

<html>

    <head>

        <title> 02 body标签(列表标签)的学习</title>

        <meta charset="UTF-8"/>

    </head>

    <!--

        列表标签：

        1、有序列表

         ol

            li：一个li标签代表一行数据 ,自动对数据进行编号,默认从1开始小到到大编号.可以通过type自定义

        2、无序列表

          u1

            li：该标签中书写的列表内容,一个li标签代表一行数据 默认数据前有个黑点.(黑点可以去除用CSS)

        3、自定义列表

          dl

            dt:数据的标题。前边没有空格

             dd:数据的内容。前边有个制表符

    -->

    <body>

        <h3>列表标签的学习</h3>

        <hr />

        <h3>业余爱好：</h3>

        <!--有序列表,3行数据之间有先后次序,默认从1开始变化.也可以设置让其从I、A、a等开始编号-->

        <ol>

            <li>玩游戏</li>

            <li>拍篮球</li>

            <li>看电影</li>

        </ol>

        <ol type="A">

            <li>玩游戏</li>

            <li>拍篮球</li>

            <li>看电影</li>

        </ol>

        <hr />

        <h3>中国知名城市：</h3>

        <!--无序列表,3行数据之间没有先后次序-->

        <ul>

            <li>北京</li>

            <li>上海</li>

            <li>南京</li>

        </ul>

        <hr />

        <!--自定义列表-->

         <dl>

             <dt>IT课程：</dt>

             <dd>Java</dd>

             <dd>Python</dd>

             <dd>大数据</dd>

         </dl>

    </body>

</html>

二、图片标签

<html>

    <head>

        <title> 03 body图片标签学习</title>

        <meta charset="UTF-8"/>

    </head>

    <!--

        图片标签: 图片是不会自动换行的,他是行内元素

        img

         src:图片的路径(绝对路径：从根盘符出发;  相对路径：从jpg文件(所在目录)出发查找另一个文件的路径,如果在

                  一个文件夹下,可以加载,如果没有加载失败) 一般本地资源(图片在自己电脑上)使用相对路径

          width:宽度  单独设置宽度或高度浏览器会在保证图片不失真的情况下自动缩小或放大 单位：px或 %

          height：高度

          title：当鼠标放上去可以看到图片的说明

          alt:当图片加载不成功是，会显示提示文字

   -->

    <body>

        <!--使用本地资源-->

        <img src="../img/1.jpg" width="200px"/>

        <img src="../img/2.jpg" width="200px"/>

        <img src="../img/4.gif" width="200px" title="这是一个狗子在吹风扇"/>

        <img src="../img/5.gif" width="200px" alt="这是一个哈士奇"/>

        <hr />

        <!--使用网络资源-->

        <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2725440693,2929091497&fm=27&gp=0.jpg"

            width="400"/>

    </body>

</html>

[19/05/14-星期二] HTML_body标签(列表标签和图片标签)的更多相关文章

  1. [19/05/15-星期三] HTML_body标签(超链接标签和锚点)

    一.超链接标签 <html> <head> <meta charset="UTF-8"> <title>04 body超链接标签学习 ...

  2. [19/05/13-星期一] HTML_head标签 和 body标签_文本标签

    一.概念 概念:超文本标记语言 作用:需要将Java在后台根据用户的请求处理结果在浏览器显示给用户.数据已经过来了,但是显示可能比较凌乱,所以html应用而生,就像写作文要加标点看着舒服. 在浏览器中 ...

  3. Android自定义标签列表控件LabelsView解析

    版权声明:本文为博主原创文章,未经博主允许不得转载. 无论是在移动端的App,还是在前端的网页,我们经常会看到下面这种标签的列表效果:   标签从左到右摆放,一行显示不下时自动换行.这样的效果用And ...

  4. H5的段落标签、图片标签、列表标签与链接标签

    段落标签 (1)<p>段落标签</p> (2)<nobr>强制不换行标签,会出现滚动条</nobr> (3)<pre>保留原始排版标签< ...

  5. git tag 查看标签列表、切换标签

    1.查看标签列表 git tag 2.切换标签(需要指定分支 test 为分支.v0.17.7 为标签版本) git checkout -b test v0.17.7

  6. 前端 HTML body标签相关内容 常用标签 列表标签 ul，ol,li

    列表标签 ul,ol,li ul.ol.li标签 都属于块级标签,独占一行 网站页面上一些列表相关的内容比如说物品列表.人名列表等等都可以使用列表标签来展示.通常后面跟<li>标签一起用, ...

  7. HTML列表（组标签）+div（布局标签）与span

    一.列表 HTML中常见的列表有三种,分别是: 1.无序列表,是一组描述列表语义的组标签,列表中每个项之间没有先后顺序:如图: 1)组标签:组标签就是由多个标签组成的一个整体,它们之间共同存在:例如 ...

  8. HTML标签列表总览

    超文本标记语言(简称:HTML)标记标签通常被称为HTML标签,HTML标签是HTML语言中最基本的单位,HTML标签是HTML(标准通用标记语言下的一个应用)最重要的组成部分.HTML标签的大小写无 ...

  9. DEDECMS5.5/5.6/5.7列表页调用TAG标签（热门标签）的两种方法

    DEDECMS5.5/5.6/5.7列表页调用TAG标签的两种方法: 一.DedeCMSv5.6及其以前版本: dedecms默认在列表是无法调用tag标签的,经过各位版主们的帮助,现给大家提供出2种 ...

随机推荐

  1. 以太坊智能合约开发工具 Truffle 入门1

    Truffle是以太坊(Ethereum)智能合约开发的瑞士军刀,小巧好用,上手简单. 本篇文章主要展示如何用Truffle 开发第一个Ethereum智能合约. 1.准备工作:(本人针对window ...

  2. pandas处理字符串

    # pandas 字符串的处理 # 前面已经学习了字符串的处理函数 # df["bWendu"].str.replace("℃","").a ...

  3. 【串线篇】spring boot自定义starter

    starter: 一.这个场景需要使用到的依赖是什么? 二.如何编写自动配置 启动器只用来做依赖导入:(启动器模块是一个空 JAR 文件,仅提供辅助性依赖管理,这些依赖可能用于自动装配或者其他类库) ...

  4. mysql 数据库url

    jdbc:mysql://localhost:3306/database?useUnicode=true&useJDBCCompliantTimezoneShift=true&useL ...

  5. 继承父类的注入Bean

    Bcontroller 继承了 Acontroller ,Acontroller注入了一个API,通过API实现了一个功能“方法X”.在Bcontroller中调用 Acontroller 的“方法X ...

  6. shell之文本过滤（grep）

    shell之文本过滤(grep) 分类: linux shell脚本学习2012-09-14 14:17 588人阅读 评论(0) 收藏 举报 shell正则表达式扩展工具存储 grep(全局正则表达 ...

  7. 在国外搭建 Web 服务器 - Linode VPS

    在国外搭建 Web 服务器 - Linode VPS 买一台虚拟服务器(VPS),把你网站放在上面跑跑,找找感觉,平时也可以用它来练习.前几天,搜索到了有人推荐 Linode 的 VPS,昨天又有朋友 ...

  8. layui数据表格,当数据过长出现三个...的时候,点击会弹出一个框全部显示,如何去掉这个框

    最笨的方法就是通过css把那个框隐藏掉 .layui-table-tips-main{display:none} .layui-table-tips-c{display:none}

  9. 6377. 【NOIP2019模拟2019.10.05】幽曲[埋骨于弘川]

    题目描述 题解 随便bb 详细题解见 https://www.cnblogs.com/coldchair/p/11624979.html https://blog.csdn.net/alan_cty/ ...

  10. 【bzoj3195】【 [Jxoi2012]奇怪的道路】另类压缩的状压dp好题

    (上不了p站我要死了) 啊啊,其实想清楚了还是挺简单的. Description 小宇从历史书上了解到一个古老的文明.这个文明在各个方面高度发达,交通方面也不例外.考古学家已经知道,这个文明在全盛时期 ...