上一个礼拜,做crm项目,使用的大部分都是js,nodejs,ajax 的内容,但是今天我想写写关于html中的块级元素和内联元素 的东西。

首先,html 中的块级元素

内联元素

我们可以看到,这两个表格中有重复的元素,这些元素被称为可变元素

对于html中块级元素和行内元素,有什么区别呢?

块级元素会分行显示,行内元素是在同一行显示内容

具体区别如下:1.行内元素  在尺寸设置方面

设置它的宽,高,均无效

设置margin 值,左右的margin 值可以设置,上下的margin 值设置无效,

设置padding 值, 左右的padding 值可以设置,上下的paddig 值设置无效

2. 使用text-align 属性

该属性描述的是块级元素的行内内容设置文本水平对齐方式

特殊情况:在IE6/IE7/IE8 中 该属性可以让块级元素也居中对齐,但是在其他浏览器上,该属性仅仅针对于行内内容上居中对齐。

那么,如果我们想将块级元素设置为行内元素,或者将行内元素设置为会计元素该怎么办么?

使用display属性

display:inline  可以将块级元素设置为行内元素,这样,该块级元素就拥有了行内元素的特性

同样:   display:block   可以将行内元素设置为块级元素,该行内元素就 拥有了块级元素的特性,可设置宽高,margin ,padding  的各方向值。

html 中的块级元素 内联元素的更多相关文章

  1. css中的块级和内联元素

    块级元素: 首先说明display是块级元素,会单独站一行,如 代码: <!DOCTYPE html> <html> <head lang="en"& ...

  2. web兼容学习分析笔记--块级、内联、内联块级元素

    一.块级.内联.内联块级元素 (1)块级元素:block **独占一行 **可设置width,height,margin,padding **内部可包含块级或内联元素 (3)内联(行内)元素:inli ...

  3. html的块级、内联、内联块级元素基础

    概念 块级:block 内联:inline 内联块级:inline-block 在html元素中,元素会有display属性 display属性默认值是block,那么该元素是块级元素. displa ...

  4. #HTML 块级、内联、内联块级元素

    [常用的块级元素] div,form,p,table,h1~h6,hr,dl,ol,ul,pre等 [常用的内联元素] a,img,input,span,br,select,strong,em,tex ...

  5. css块级元素,内联元素,内联块状元素

    块元素 什么是块级元素?在html中<div><p><h1><form><ul>之类的就是块级元素.设置display:block是就将元素 ...

  6. HTML元素分类:块级元素 内联元素和内联块状元素

    在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 1,块状元素 常用的块状元素有: <div>.<p>.<h1 ...

  7. HTML元素分类 块级元素 内联元素 块级内联元素

    概述 HTML中存在许多元素,如<h1>,<p>,<a>,<block>,<image>,这些元素可分为三类,依次是块级元素,内联元素,块级 ...

  8. 顶级、块级、内联,html元素的三大分类

    学习html后, 你会了解一些基本的html元素(Element), 如p, h1~h6, br, div, li, ul, img等.如果将这些元素细分, 又可以分别归为顶级(top-level)元 ...

  9. html 块状元素 行内元素 内联元素

    块状(Block)类型的元素的width默认为100%,而行内(Inline)类型的元素则是根据自身的内容及子元素来决定宽度. 块元素(block element) address - 地址 bloc ...

随机推荐

  1. redis在spring中的配置及java代码实现

    1.建一个redis.properties属性文件 # Redis Setting redis.addr = 127.0.0.1 redis.port = 6379 redis.auth = mast ...

  2. BZOJ 1649: [Usaco2006 Dec]Cow Roller Coaster( dp )

    有点类似背包 , 就是那样子搞... --------------------------------------------------------------------------------- ...

  3. python函数any()与all()

    any(iterable) all(iterable) any()与all()函数的区别,any是任意,而all是全部. 版本:该函数适用于2.5以上版本,兼容python3版本. any(itera ...

  4. poj 2398 计算几何

    #include <iostream> #include<cstdio> #include<cstring> #include <algorithm> ...

  5. selenium 学习笔记 ---新手学习记录(3) 问题总结(java)

    1.验证码简单处理 /** * 验证码等待输入函数 * */ private void ZcYzm(WebDriver driver){ boolean flag=false; while(flag= ...

  6. C语言实现约瑟夫环讨论

    [问题描述]     约瑟夫(Joseph)问题的一种描述是:编号为1,2,…,n的n个人按顺时针方向围坐一圈,每人持有一个密码(正整数).一开始任选一个正整数作为报数上限值m,从第一个人开始按顺时针 ...

  7. 10,随机等概率的输出m个不重复的数

    今天看到一段代码,可以从0.....n-1中随机等概率的输出m个不重复的数(n远远大于m).遂记录下来. 首先,产生随机数,不免要用到srand,rand函数.先简单介绍下两个函数. 1,void s ...

  8. 1_HelloWorld

    学iOS开发与学Swift是两件事情,Swift只是一种语言,它有官方手册,里面包含了全部的语法.对其他任何一门语言很熟悉的人,学习Swift可能只需要几天的时间.而这之后,学习iOS开发才是难点,有 ...

  9. 阿里云ECS每天一件事D2:配置防火墙

    在linux中配置防火墙是一件比较有风险的事情,尤其是在ECS中,一个不当心的操作,可能就会需要重置服务器. 包括阿里云的官方建议,不要配置防火墙,没有必要什么的吧啦吧啦…… (http://bbs. ...

  10. angulajs 如何在controller 之间共享数据

    当在一个controller中 通过设置$scope的数据,来影响其它control的范围时,可以使用$rootScope 举个例子: 在一个control A范围内设置 mainApp.contro ...