HTML中行内元素与块级元素的区别:

在标准文档流里面,块级元素具有以下特点:

①总是在新行上开始,占据一整行;

②高度,行高以及外边距和内边距都可控制;

③宽带始终是与浏览器宽度一样,与内容无关;

④它可以容纳内联元素和其他块元素

行内元素的特点:

①和其他元素都在一行上;

②高,行高及外边距和内边距部分可改变;

③宽度只与内容有关;

④行内元素只能容纳文本或者其他行内元素。

不可以设置宽高,其宽度随着内容增加,高度随字体大小而改变,内联元素可以设置外边界,但是外边界不对上下起作用,只能对左右起作用,也可以设置内边界,但是内边界在ie6中不对上下起作用,只能对左右起作用

常见的块级元素与行内元素:

  • 块元素(block element)
  1. * address - 地址
  2.   * blockquote - 块引用
  3.   * center - 举中对齐块
  4.   * dir - 目录列表
  5.   * div - 常用块级容易,也是css layout的主要标签
  6.   * dl - 定义列表
  7.   * fieldset - form控制组
  8.   * form - 交互表单
  9.   * h1 - 大标题
  10.   * h2 - 副标题
  11.   * h3 - 3级标题
  12.   * h4 - 4级标题
  13.   * h5 - 5级标题
  14.   * h6 - 6级标题
  15.   * hr - 水平分隔线
  16.   * isindex - input prompt
  17.   * menu - 菜单列表
  18.   * noframes - frames可选内容,(对于不支持frame的浏览器显示此区块内容
  19.   * noscript - 可选脚本内容(对于不支持script的浏览器显示此内容)
  20.   * ol - 排序表单
  21.   * p - 段落
  22.   * pre - 格式化文本
  23.   * table - 表格
  24.   * ul - 非排序列表
  • 行内元素(inline element)
  1. * a - 锚点
  2.   * abbr - 缩写
  3.   * acronym - 首字
  4.   * b - 粗体(不推荐)
  5.   * bdo - bidi override
  6.   * big - 大字体
  7.   * br - 换行
  8.   * cite - 引用
  9.   * code - 计算机代码(在引用源码的时候需要)
  10.   * dfn - 定义字段
  11.   * em - 强调
  12.   * font - 字体设定(不推荐)
  13.   * i - 斜体
  14.   * img - 图片
  15.   * input - 输入框
  16.   * kbd - 定义键盘文本
  17.   * label - 表格标签
  18.   * q - 短引用
  19.   * s - 中划线(不推荐)
  20.   * samp - 定义范例计算机代码
  21.   * select - 项目选择
  22.   * small - 小字体文本
  23.   * span - 常用内联容器,定义文本内区块
  24.   * strike - 中划线
  25.   * strong - 粗体强调
  26.   * sub - 下标
  27.   * sup - 上标
  28.   * textarea - 多行文本输入框
  29.   * tt - 电传文本
  30.   * u - 下划线
  31.   * var - 定义变量

wed网页开发面试笔试必备小知识的更多相关文章

  1. iOS开发——面试笔试精华(四)

    面试笔试精华(四) 1.        Object-C有多继承吗?没有的话用什么代替?
 1>  OC是单继承,没有多继承 2>  有时可以用分类和协议来代替多继承 2.        ...

  2. iOS开发——面试笔试精华(三)

    面试笔试精华(三) 1.        When to use NSMutableArray and when to use NSArray? 什么时候使用NSMutableArray,什么时候使用N ...

  3. iOS开发——面试笔试精华(二)

    面试笔试精华(二) 警告:一定要把英文题目过一遍,有些公司的题目故意弄成英文的!!! 1.        Difference between shallow copy and deep copy? ...

  4. iOS开发——面试笔试精华(一)

    面试笔试精华(一) 1.        #import 跟#include.@class有什么区别?#import<> 跟 #import”"又什么区别? 1>  #imp ...

  5. 面试总结:鹅厂Linux后台开发面试笔试C++知识点参考笔记

    文章每周持续更新,各位的「三连」是对我最大的肯定.可以微信搜索公众号「 后端技术学堂 」第一时间阅读(一般比博客早更新一到两篇) 文章是由自己笔试面试腾讯的笔记整理而来,整理的时候又回顾了一遍,中间工 ...

  6. 关于新手使用mpb开发代码的一些小知识

    mac 前端端口占用解决   1.查看8080端口,复制进程PID  lsof -i :8080 2.杀死进程 kill -9 「进程PID」   如果你的mac不能使用sudo解决办法   错误提示 ...

  7. bootstrap学习笔记(网页开发小知识)

    这是我在学习Boostrap网页开发时遇到的主要知识点: 1.导航条navbar 添加.navbar-fixed-top类可以让导航条固定在顶部,固定的导航条会遮住页面上的其他内容,除非给<bo ...

  8. 物联网 软硬件系统 树莓派 单片机 esp32 小程序 网页 开发 欢迎相互交流学习~

    物联网软硬件开发 知识分享 多年学生项目开发经验 物联网 软硬件系统 树莓派 单片机 esp32 小程序 网页 开发 欢迎相互交流学习~ http://39.105.218.125:9000/

  9. iOS APP开发的小知识(分享)

          亿合科技小编发现从2007年第一款智能手机横空出世,由此开启了人们的移动智能时代.我们从一开始对APP的陌生,到现在的爱不释手,可见APP开发的出现对我们的生活改变有多巨大.而iOS AP ...

随机推荐

  1. 武汉科技大学ACM:1008: 明明的随机数

    Problem Description 明明想在学校中请一些同学一起做一项问卷 调查,为了实验的客观性,他先用计算机生成了N个1到1000之间的随机整数(N≤100),对于其中重复的数字,只保留一个, ...

  2. Phpcms V9全站伪静态设置方法

    为什么要伪静态?具体在这里就不说了,你懂的!一方面更新修改后不需要生成静态文件,另一方面为了SEO! 访问规则如下 1 2 list-{$catid}-{$page}.html content-{$c ...

  3. asp.net 解决IE11下 From身份验证失效问题

    指定如何将 Cookie 用于 Web 应用程序. <forms cookieless="UseCookies" name="test" loginUrl ...

  4. 文字列表无缝向上滚动JavaScript代码

    <!DOCTYPE html> <html> <head> <meta charset=utf-> <title>文字列表无缝向上滚动Jav ...

  5. js识别终端类型

    <script type="text/javascript"> function browserRedirect() { var sUserAgent= navigat ...

  6. OpenStack JEOS 镜像

    JEOS:Just Enough Operating System 维基百科地址:http://en.wikipedia.org/wiki/Just_enough_operating_system O ...

  7. ubuntu 12.04 安装nginx

    nginx是一个强大的高性能反向代理服务器,其特点是占内存少,并发能力强,在高并发的情况下是apache 的一个不错的代替品,能够支持高达50000个并发连接数的响应,那么这么强大的武器,究竟如何在l ...

  8. IOS面试攻略

    IOS面试攻略(1.0) 2013-10-13 20:58:09|  分类: IOS面试 |  标签:ios知识点总汇  ios面试  |举报|字号 订阅     来自:伊甸网 @ 看到这个关键字,我 ...

  9. swift和 oc 混编2-备

    在Swift语言出现之前,开发iOS或OS X应用主要使用Objective-C语言,此外还可以使用C和C++语言,但是UI部分只能使用Objective-C语言. 选择语言 Swift语言出现后,苹 ...

  10. Delphi判断进程是否存在(使用CreateToolhelp32Snapshot)

      program Project2; uses windows,TLHelp32; function FindProcess(AFileName:string):boolean; var hSnap ...