前几天在一本教材上看到关于HTML标签嵌套规则一节的时候,看到这么一句话,“把图像作为body元素的子元素直接插入到页面中,这样是不妥的,一是结构嵌套有误,二是图像控制不方便。”后面还给了一段代码演示如下:

  当时我很不理解,难道我这些年的做法都是错误的吗?

  上网查了好多资料也没查出所以然,跟好友交流一下得到了以下结论:

    1.首先人家说的不妥,并不是不能够,这意思并不是说img 不能放到body里面,而是对整体结构来说,这样子不好控制,最好在其之外加个div来控制图片的显示位置、大小等。

    2.就是说白了一个事,不建议img标签直接放body里面,最好使用div 包裹住,img标签创建的是被引用图像的占位空间,技术角度上讲,不是img占用的,而是它的引用图像占用的空间,所以控制布局的时候就不如div 更加灵活。

img标签不能直接作为body的子元素的更多相关文章

  1. 父元素a标签的href默认行为以及子元素绑定的click事件的响应之间存在影响

    原文地址 背景 开发过程中遇到问题,简单写个demo 运行环境为Chrome 68 描述一下这个问题,当a标签内部存在嵌套时, 父元素a标签的href默认行为以及子元素绑定的click事件的响应之间存 ...

  2. a标签嵌套href默认行为与子元素click事件存在影响

    2018-08-07 Question about work 开发过程中遇到问题,简单写个demo 运行环境为Chrome 68 描述一下这个问题,当<a>标签内部存在嵌套时, 父元素&l ...

  3. html5shiv主要解决IE6-8 无法识别HTML5的新标签,父节点不能包裹子元素,以及应用CSS样式

    html5shivehtml5shiv主要IE6-8解决:1,HTML5提出的新的元素不被IE6-8识别.2,这些新元素不能作为父节点包裹子元素,3,并且不能应用CSS样式.让CSS 样式应用在未知元 ...

  4. HTML+CSS系列:CSS选择器(标签、ID、类、通配符、后代、子元素、并集、伪类)

    一.标签选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  5. CSS选择器(通配符选择器、标签选择器、类选择器、id选择器、群组选择器、后代选择器、子元素选择器和相邻元素选择器)

    通配符选择器  *   与任何元素匹配 派生选择器: 后代选择器(包含选择器):后代选择器可以选择作为元素后代的元素 A B    对A元素中的B元素应用样式 后代选择器中两个元素间的层次间隔可以是无 ...

  6. 表单的子元素可不在form标签内

    表单是网页用于向服务器发送数据的元素.其用法类似下面: <form method="POST" action="/login"> <input ...

  7. 深入学习jQuery选择器系列第八篇——过滤选择器之伪子元素选择器

    × 目录 [1]通用形式 [2]反向形式 [3]首尾元素 [4]唯一元素 前面的话 本文是子元素选择器的续篇,主要介绍关于nth-of-type()选择器的内容.该部分内容并非没有出现在<锋利的 ...

  8. CSS关于子元素设置了float属性后父元素高度为0的解释和解决方法

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  9. jquery选择器 之 获取父级元素、同级元素、子元素

    jquery选择器 之 获取父级元素.同级元素.子元素 一.获取父级元素 1. parent([expr]): 获取指定元素的所有父级元素 <div id="par_div" ...

随机推荐

  1. 在VM上安装OpenWrt

    1.选择'自定义',点击'下一步' 2.'硬件兼容性'默认,点击'下一步' 3.'稍后安装操作系统',点击'下一步' 4.客户机操作系统'Linux' 版本'CentOS 64位',点击'下一步' 说 ...

  2. jquery 往上滚动的时显示,上下滚动执行的js

    $(document).on("mousewheel DOMMouseScroll", function (e) { var delta = (e.originalEvent.wh ...

  3. C++ Qt基础知识

    时间如流水,只能流去不流回. 学历代表你的过去,能力代表你的现在,学习能力代表你的将来. 学无止境,精益求精. 记录C++ Qt的基础知识学习记录 <C++ Qt设计模式(第二版)>

  4. 你真的了解 volatile 关键字吗?

    今天,让我们一起来探讨 Java 并发编程中的知识点:volatile 关键字 本文主要从以下三点讲解 volatile 关键字: volatile 关键字是什么? volatile 关键字能解决什么 ...

  5. foreach数组并直接改变数组内容

    <?php $arr = array(1, 2, 3, 4); foreach ($arr as &$value) { $value = $value * 2; } // $arr is ...

  6. egg-middleware 中间件

    Middleware 中间件 Egg 的中间件形式和 Koa 的中间件形式是一样的,都是基于洋葱圈模型.每次我们编写一个中间件,就相当于在洋葱外面包了一层. 编写中间件 写法 我们先来通过编写一个简单 ...

  7. Linux系统 multitail 同时跟踪查看多个日志文件

    一.问题描述: 平时我们在排查问题的时候往往需要查看日志文件来定位问题,有些程序可能关联的多个程序,因此需要打开多个窗口使用 tailf 或者tail -f 方式查看日志 但是需要不停的切换窗口来看不 ...

  8. 使用Typescript重构axios(二十七)——添加请求状态码合法性校验

    0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三) ...

  9. P4568 [JLOI2011]飞行路线 分层图

    题目描述 Alice和Bob现在要乘飞机旅行,他们选择了一家相对便宜的航空公司.该航空公司一共在nn个城市设有业务,设这些城市分别标记为00到n-1n−1,一共有mm种航线,每种航线连接两个城市,并且 ...

  10. 大数据之路day03--java循环的延申与练习(while 、do-while、for)

    在今天,我突然被一个很尴尬的问题问到了,问题是这样的:说一下java循环的应用场景. 我想很多人一下子听到这样的问题不知道怎么回答,大部分人会去想有什么循环格式,特点是什么.这些都是错误的,在往后的面 ...