html 中的块级元素 内联元素

上一个礼拜,做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  的各方向值。

时间: 2024-08-06 07:41:11

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

HTML之class属性、table元素、块级和内联元素

一:网页的组成部分: 1.结构:HTML 2.样式:CSS 3.行为:Javascript 二:介绍新的属性:class(类),直接用例子来解释该属性的用法: 给一个标签确定样式的三种方法(按样式表的位置区分): 1.行间样式表:在<body>内直接添加样式,如: < p class="box" style="color:blue">测试文字</p> 2.内部样式表: 1)在<body>内需要添加样式的属性处输入,如:

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

一.块级.内联.内联块级元素 (1)块级元素:block **独占一行 **可设置width,height,margin,padding **内部可包含块级或内联元素 (3)内联(行内)元素:inline **和其他inline元素同行显示 **可以设置margin-left,margin-righ,padding-left,padding-right, **无效设置widht,height,margin-top,margin-bottom,padding-top,padding-bottom

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

概念 块级:block 内联:inline 内联块级:inline-block 在html元素中,元素会有display属性 display属性默认值是block,那么该元素是块级元素. display属性默认值是inline,那么该元素是内联元素. 没有元素的display默认值是inline-block. display属性值可以被设置,比如可以把块级元素div的display的值设成inline,那么它就变成了内联元素,不再独行显示. 特征 1.块级元素 独占一行. 可设置width,he

html 块状元素 内联元素

块状元素 address - 地址blockquote - 块引用center - 举中对齐块dir - 目录列表div - 常用块级容易,也是CSS layout的主要标签dl - 定义列表fieldset - form控制组form - 交互表单h1 - 大标题h2 - 副标题h3 - 3级标题h4 - 4级标题h5 - 5级标题h6 - 6级标题hr - 水平分隔线isindex - input prompt menu - 菜单列表noframes - frames可选内容,(对于不支持f

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

在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 1,块状元素 常用的块状元素有: <div>.<p>.<h1>...<h6>.<ol>.<ul>.<dl>.<table>.<address>.<blockquote> .<form> 什么是块级元素?在html中<div>. <p>.<

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

块元素 什么是块级元素?在html中<div><p><h1><form><ul>之类的就是块级元素.设置display:block是就将元素显示为块级元素.如下代码就是将内联元素a转换为块状元素,从而使a元素具有块状元素特点. 块级元素特点: 1.每个块级元素都从新的一行开始,并且其后的元素也另起一行. 2.元素的高度,宽度,行高以及顶和底边距都可设置. 3.元素宽度在不设置的情况下,是它本身你窗口的100%(和你元素的宽度一致),除非设定一个宽

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

学习html后, 你会了解一些基本的html元素(Element), 如p, h1~h6, br, div, li, ul, img等.如果将这些元素细分, 又可以分别归为顶级(top-level)元素,块级(block-level)元素和内联(inline)元素. 1. Top-level element [顶级元素]:    { html, body, frameset }包括html, body, frameset, 表现如Block-level element, 属于高级块级元素. 2.

3.3 块元素 内联元素 内联块元素

元素就是标签,布局中常用的有三种标签,块元素 .内联元素.内联块元素 3.3.1 块元素 块元素,也可以称为行元素,布局中常用的标签有:div \ p\ ul\ li \h1-h6\ dl\ dt\ dd等都是块元互:它在布局中的行为: a.支持全部的样式 b.如果没有设置宽度,那么默认的宽度为父级宽宽的100% c.盒子占据一行,即使设置了宽度 3.3.2 内联元素 内联元素,也可以称为行内元素,布局中常用的标签如:a  pan  em  b  strong  i等,它们在布局中的行为: a.

css 块状元素与行内元素(内联元素)的理解

块状元素: 它一般是其他元素的容器元素,可以容纳块状元素和行内元素,它默认是不会和其他元素同一行的,即相当于两个块状元素写一起是垂直布局的.最常用的是div和p 行内元素: 行内元素又称内联元素,它只能够容纳文本及其他行内元素,常见的行内元素有 超链接,a, span ,img 行内元素与块状元素的差异是:行内元素并不会从新的一行开始,水平方向会一个个接着. 每个块状元素会从新的一行开始. 强调一下: display:block; float:left/right; 当css对行内元素定义这两属