1.行级元素/内联元素 inline

特点:

1)内容决定元素所占位置(所占大小),不独占一行

2)元素之间存在默认大小的间隙

3)不可以通过CSS改变宽高

span strong em a del

2.块级元素 block

特点:

1)独占一行

2)可以通过CSS改变宽高

div p ul li ol form address

3.行级块元素 inline-block

特点:

1)内容决定大小

2)可以通过CSS改变宽高

3)不独占一行

4、行、块、行快之间关系

行、块、行快级标签的由默认属性决定,也可以修改

凡是带有inline的元素,都有文字属性,之间会有HTML默认的空格

sapn{

display:inline;    //原来默认属性

display:block;    //变为block属性,行变块

}

div{

display:block;    //原来默认属性

display:inline;    //变为inline属性,块变行

}

img{

display:inline-block;

}

5、图片拼接,处理图片之间的空格

注意:凡是带有inline的元素,都有文字属性,之间会有HTML默认的空格

img为行快标签,一定带有inline属性,内容之间必定会有HTNL默认空格

HML代码

<body>

<img src="fy.jpg">

<img src="fy.jpg">

<img src="fy.jpg">

<img src="fy.jpg">

</body>

方法一:不正确,当页面压缩时会改变,不准

img{

border:0;

width:100px;

height:200px;

    margin-left:-6px;    //元素与元素之间的空隙

}

方法二:

HTML(六)--总结的更多相关文章

  1. 如何一步一步用DDD设计一个电商网站(六)—— 给购物车加点料,集成售价上下文

    阅读目录 前言 如何在一个项目中实现多个上下文的业务 售价上下文与购买上下文的集成 结语 一.前言 前几篇已经实现了一个最简单的购买过程,这次开始往这个过程中增加一些东西.比如促销.会员价等,在我们的 ...

  2. MVVM模式解析和在WPF中的实现(六) 用依赖注入的方式配置ViewModel并注册消息

    MVVM模式解析和在WPF中的实现(六) 用依赖注入的方式配置ViewModel并注册消息 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二 ...

  3. 【原】AFNetworking源码阅读(六)

    [原]AFNetworking源码阅读(六) 本文转载请注明出处 —— polobymulberry-博客园 1. 前言 这一篇的想讲的,一个就是分析一下AFSecurityPolicy文件,看看AF ...

  4. CRL快速开发框架系列教程六(分布式缓存解决方案)

    本系列目录 CRL快速开发框架系列教程一(Code First数据表不需再关心) CRL快速开发框架系列教程二(基于Lambda表达式查询) CRL快速开发框架系列教程三(更新数据) CRL快速开发框 ...

  5. 【微信小程序开发•系列文章六】生命周期和路由

    这篇文章理论的知识比较多一些,都是个人观点,描述有失妥当的地方希望读者指出. [微信小程序开发•系列文章一]入门 [微信小程序开发•系列文章二]视图层 [微信小程序开发•系列文章三]数据层 [微信小程 ...

  6. 我的MYSQL学习心得(六) 函数

    我的MYSQL学习心得(六) 函数 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) 数据类 ...

  7. 我的MYSQL学习心得(十六) 优化

    我的MYSQL学习心得(十六) 优化 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) 数据 ...

  8. ASP.NET MVC Model绑定(六)

    ASP.NET MVC Model绑定(六) 前言 前面的篇幅对于IValueProvider的使用做个基础的示例讲解,但是没并没有对 IValueProvider类型的实现做详细的介绍,然而MVC框 ...

  9. redis成长之路——(六)

    redis配置 为了码农在代码上只关心业务以及代码上的统一性,wenli.drive.redis内部使用配置来完成那些不同的场景,也就是说随便填填配置就能适应不同的场景! 当然配置多了码农也会受不了, ...

  10. SQL Server-聚焦EXISTS AND IN性能分析(十六)

    前言 前面我们学习了NOT EXISTS和NOT IN的比较,当然少不了EXISTS和IN的比较,所以本节我们来学习EXISTS和IN的比较,简短的内容,深入的理解,Always to review ...

随机推荐

  1. dict使用

    里面的元素是:key: value d = { 'Adam':95, 'Lisa':85, 'Bart':59, 'Paul':75 } 打印:print d['Paul'] 注意:  通过 key ...

  2. mui 配置底部tab切换方式以模板的方式访问

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Python - requests https请求的坑

    #-*-coding:utf-8-*- # Time:2017/9/25 20:41 # Author:YangYangJun import requests import ssl from requ ...

  4. nodejs模拟http发送请求

    首先需要安装模块request,然后代码如下: //模拟发送http请求 var request = require("request"); //get请求 request('ht ...

  5. office2016如何激活

    office2016如何激活 一.总结 一句话总结:office2016没有激活成功,下了一个office2013破解版 office2013破解版 二.自己做法 三中的方法点赞蛮多的(100多个), ...

  6. 雷林鹏分享:XML 元素

    XML 元素 XML 文档包含 XML 元素. 什么是 XML 元素? XML 元素指的是从(且包括)开始标签直到(且包括)结束标签的部分. 一个元素可以包含: 其他元素 文本 属性 或混合以上所有. ...

  7. spring cloud ----> RibbonClient设置的熔断器Hystrix不起作用

    Ribbon spring.io 官网的简介: Ribbon is a client side load balancer which gives you a lot of control over ...

  8. c# 正则表达式如何处理换行符?

    我们要分析网页,把整个网页内容作为匹配源,但是c#的正则表达式是默认以一行为单位的,使用 RegexOptions.Multiline 也没有实质性作用(它知识改变了^和$的行为) 只要在正则表达式前 ...

  9. POJ-2955 Brackets(括号匹配问题)

    题目链接:http://poj.org/problem?id=2955 这题要求求出一段括号序列的最大括号匹配数量 规则如下: the empty sequence is a regular brac ...

  10. apicloud 聊天输入框模块UIChatBox

    点击链接查看详情 https://docs.apicloud.com/Client-API/UI-Layout/UIChatBox 模板中包括,聊天输入框,表情,发送图片,还有拍照,录音,其中也可以放 ...