HTML标签的三种类型
HTML标签的类型分为三种:行内元素,行内块元素,块级元素
而标签的属性是可以转换的
display:inline: 转换为行内元素
display:linline-block 转换为行内块元素
display:block 转换为块级元素
特性:
行内元素:
1.无法设置宽高
2. margin上下无效,只有左右有效果,padding都有效果,会撑大空间;
box-sizing:border-box;无效,因为该属性针对盒模型
3.不会自动换行
行内块元素:
1. 不会自动换行
2.能够设置宽高
3.默认排列方式为从左到右
4.可以使用text-align:center使内容相对于父盒子水平居中对齐,例如img标签,可以使用text-align:center,相对父盒子居中对齐.,margin:0 auto无效
5.水平排列,但所有元素默认会有1个空格的间隙,因为元素之间在html中书写有回车换行,浏览器解析会将其解析成一个空格.
块级元素:
1.能够识别宽高
2.margin和padding的上下左右均对其有效
3.可以自动换行
4.多个块状元素标签写在一起,默认排列方式为从上至下
5.可以使用margin:0 auto居中对齐
HTML标签的三种类型的更多相关文章
- 链路层三种类型的MAC地址
若需要转载,请注明出处. 我们知道,链路层都是以MAC地址来进行通信双方的地址标识的,如下图:在应用中根据接收方的多寡来进行划分,可分为以下三种: 单播(Unicast) 多播(Multicast) ...
- php删除html标签的三种解决方法
分享下PHP删除HTMl标签的三种方法. 方法1:直接取出想要取出的标记 <?php //取出br标记 function strip($str) { $str=str_replace(" ...
- javascript生成新标签的三种方法
javascript生成新标签的三种方法:http://www.cnblogs.com/online-link/p/6062423.html
- matlab for循环的三种类型
学习了一半了,发现一个好网站,就是我想写这篇博客用的,网络真是个好东西!纪念下国庆啦 网址:http://www.yiibai.com/matlab/matlab_for_loop.html ---- ...
- C# enum、int、string三种类型互相转换
enum.int.string三种类型之间的互转 #代码: public enum Sex { Man=, Woman= } public static void enumConvert() { in ...
- 缓慢变化维 (Slowly Changing Dimension) 常见的三种类型及原型设计(转)
开篇介绍 在从 OLTP 业务数据库向 DW 数据仓库抽取数据的过程中,特别是第一次导入之后的每一次增量抽取往往会遇到这样的问题:业务数据库中的一些数据发生了更改,到底要不要将这些变化也反映到数据仓库 ...
- ASP.NET 设计模式分为三种类型
设计模式分为三种类型,共23类. 一.创建型模式:单例模式.抽象工厂模式.建造者模式.工厂模式.原型模式. 二.结构型模式:适配器模式.桥接模式.装饰模式.组合模式.外观模式.享元模式.代 ...
- 云计算服务的三种类型(SaaS、PaaS、IaaS)
云计算可以帮助企业降低IT方面的成本和复杂性,并获得他们蓬勃发展所需的灵活性与敏捷性.但是,规划出通往云的明确路径并非易事.毕竟用户需要看透与云相关的市场大肆宣传,然后理解并分析不同种类的云计算模式的 ...
- OOM三种类型
OOM的三种类型: 堆OOM /** * -Xmx1g -XX:+PrintGCDetails -XX:MaxDirectMemorySize=100m * * @param args */ publ ...
随机推荐
- openfire build
1. build path: a) source folder:包括openfire和各插件的代码. b) libraries:build/lib下jar包和插件下jar包,jdk/lib/tools ...
- SocketSessionConfig参数设制
Mina 是一个韩国人写的基本java NIO的一个高性能的传输框架,我们的搜索就是基本它作为一个搜索服务开放接口了.对于系统的TIME_WAIT过多,造成服务器的负载过高,这个问题我也不用多说了,这 ...
- action和servlet共存(转)
转自:http://www.cnblogs.com/nayitian/archive/2013/03/04/2942537.html 问题 项目要求struts2和servlet能够共存,就是stru ...
- 详解C/C++ 编译 g++ gcc 的区别
我们在编译c/c++代码的时候,有人用gcc,有人用g++,于是各种说法都来了,譬如c代码用gcc,而c++代码用g++, 或者说编译用gcc,链 接用g++,一时也不知哪个说法正确,如果再遇上个ex ...
- HihoCoder1652 : 三角形面积和2([Offer收割]编程练习赛38)(几何)(不会几何,占位)
描述 如下图所示,在X轴上方一共有N个三角形.这些三角形的底边与X轴重合,底边上两个顶点的坐标分别是(Li, 0)和(Ri, 0),底边的对顶点坐标是(Xi, Yi).其中Li ≤ Xi ≤ Ri 且 ...
- python爬虫知识点总结(九)Requests+正则表达式爬取猫眼电影
一.爬取流程 二.代码演示 #-*- coding: UTF-8 -*- #_author:AlexCthon #mail:alexcthon@163.com #date:2018/8/3 impor ...
- OGG 11g Checkpoint 详解
OGG Checkpoint 详解 定位中断的位置,下次启动从中断的位置开始恢复. 1.target 端配置: 2.一条记录对应一个replicat 一. Extract Check ...
- BZOJ1568:[JSOI2008]Blue Mary开公司
浅谈标记永久化:https://www.cnblogs.com/AKMer/p/10137227.html 题目传送门:https://www.lydsy.com/JudgeOnline/proble ...
- 如何将ajax请求同步化
(function ($) { var a = ['test1', 'test2', 'test3', 'test4']; recursive(3, 'test').done(function (re ...
- [poj2891]Strange Way to Express Integers(扩展中国剩余定理)
题意:求解一般模线性同余方程组 解题关键:扩展中国剩余定理求解.两两求解. $\left\{ {\begin{array}{*{20}{l}}{x = {r_1}\,\bmod \,{m_1}}\\{ ...