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 的各方向值。
html 中的块级元素 内联元素的更多相关文章
- css中的块级和内联元素
块级元素: 首先说明display是块级元素,会单独站一行,如 代码: <!DOCTYPE html> <html> <head lang="en"& ...
- web兼容学习分析笔记--块级、内联、内联块级元素
一.块级.内联.内联块级元素 (1)块级元素:block **独占一行 **可设置width,height,margin,padding **内部可包含块级或内联元素 (3)内联(行内)元素:inli ...
- html的块级、内联、内联块级元素基础
概念 块级:block 内联:inline 内联块级:inline-block 在html元素中,元素会有display属性 display属性默认值是block,那么该元素是块级元素. displa ...
- #HTML 块级、内联、内联块级元素
[常用的块级元素] div,form,p,table,h1~h6,hr,dl,ol,ul,pre等 [常用的内联元素] a,img,input,span,br,select,strong,em,tex ...
- css块级元素,内联元素,内联块状元素
块元素 什么是块级元素?在html中<div><p><h1><form><ul>之类的就是块级元素.设置display:block是就将元素 ...
- HTML元素分类:块级元素 内联元素和内联块状元素
在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 1,块状元素 常用的块状元素有: <div>.<p>.<h1 ...
- HTML元素分类 块级元素 内联元素 块级内联元素
概述 HTML中存在许多元素,如<h1>,<p>,<a>,<block>,<image>,这些元素可分为三类,依次是块级元素,内联元素,块级 ...
- 顶级、块级、内联,html元素的三大分类
学习html后, 你会了解一些基本的html元素(Element), 如p, h1~h6, br, div, li, ul, img等.如果将这些元素细分, 又可以分别归为顶级(top-level)元 ...
- html 块状元素 行内元素 内联元素
块状(Block)类型的元素的width默认为100%,而行内(Inline)类型的元素则是根据自身的内容及子元素来决定宽度. 块元素(block element) address - 地址 bloc ...
随机推荐
- idea14 maven项目 jdk编译版本无法修改
需要在pom中加入以下的内容,即可修改对应的jdk版本 <build> <plugins> <plugin> <groupId>org.apache.m ...
- React使用笔记(3)-React Event Listener
Date: 2015-11-28 12:18 Category: Web Tags: JavaScript Author: 刘理想 [toc] 1. 构造基本结构 首先,我们先创建一个按钮,一个输入框 ...
- IOS 学习笔记(4) 控件 标签(UILabel)的使用方法
虽说Label的中文翻译是标签标记,但它其实是一个静态文本内容的展现控件. 一般来说,UILabel只是一个只读的文本视图,开发者可以利用UiLabel来展示内容长度有固定上限的文字内容.并且,UIL ...
- Docker学习总结之Run命令介绍
Docker学习总结之Run命令介绍 本文由Vikings(http://www.cnblogs.com/vikings-blog/) 原创,转载请标明.谢谢! 在使用Docker时,执行最多的命令某 ...
- nginx 重写 rewrite 基础及实例(转)
nginx rewrite 正则表达式匹配 大小写匹配 ~ 为区分大小写匹配 ~* 为不区分大小写匹配 !~和!~*分别为区分大小写不匹配及不区分大小写不匹配 文件及目录匹配 -f和!-f用来判断是否 ...
- 基于Visual C++2013拆解世界五百强面试题--题14-循环删除
有一个数组a[1000]存放0-1000,要求每隔二个数删除一个数,到末尾时循环到开头继续进行,求最后一个被删掉数的原始下标. 看到题目可以用循环链表保存这些数,然后循环删除,大大减少了一些复杂的边界 ...
- java.lang.class.getResource
静态块,在项目启动的时候就执行,是主动执行的. 静态方法, 是被动执行的,需要被调用才执行. static{ try { String path = Conf ...
- 制作cdlinux u盘启动
U盘一个 CDlinux的iso镜像文件 UltraISO grub4dos grubinst 方法/步骤1 1 [第一步]:用UltraISO把CDlinux的镜像刻录进U盘. 打开UltraISO ...
- IPv4头部结构具体解释
IPv4头部结构具体解释 下面为书中原文摘录: $(function () { $('pre.prettyprint code').each(function () { var lines = $(t ...
- UC/0S2之中断
中断是计算机系统处理异步事件的重要机制.当异步事件发生时,事件通常是通过硬件向cpu发出中断请求的.在一般情况下,cpu响应这个请求后会立即运行中断服务程序来处理该事件: 为了处理任务延时.任务调度等 ...