block与inline,inline和inline-block,块级和行内元素,行内替换和行内非替换元素
block:块级元素默认display属性为block;无论块内内容有多少,总是占满一行;
inline:行内元素默认display属性为inline;只占据块内的内容的大小,不会占满一整行;
inline-block:将行内元素的display属性改为inline-block就可以控制行内元素的长和宽;
常见的块级元素:div ul ol li dl dt p;常用的行内元素:a b span img input ;
inline-block和block的区别:简单点说,布局的时候,想在行级元素内添加块级元素,要换行就使用block,不要换行就是用inline-block.input和img为替换元素,直接可以控制替换元素的宽和高。
block与inline,inline和inline-block,块级和行内元素,行内替换和行内非替换元素的更多相关文章
- 块级标签与预格式化文本标签----------大多数XHTML可以表示为两种类型的标签:块标签(block tag)和内联标签(inline tag)
<html> <head> <meta charset="utf-8"> <title>块级标签</title> < ...
- css盒模型和块级、行内元素深入理解
盒模型是CSS的核心知识点之一,它指定元素如何显示以及如何相互交互.页面上的每个元素都被看成一个矩形框,这个框由元素的内容.内边距.边框和外边距组成,需要了解的朋友可以深入参考下 一.CSS盒模型 盒 ...
- css菜鸟学习之text-align属性,行内元素,块级元素居中详解
一.text-align属性 1.text-align用来设置元素中的的文本对齐方式,例如:如果需要设置图片的对齐方式,需要设置图片的父元素的text-align属性: 2.text-align只对文 ...
- 前端css之文本操作及块级元素和行内元素
1.文本操作 1.1文本颜色(color) 颜色指定方式: 十六进制值 - 如: #FF0000 一个RGB值 - 如: RGB(255,0,0) 颜色的名称 - 如: red 1.2水平对齐方式 ...
- CSS中的块级元素(block)与行内元素(inline)
css中有3种基本的定位机制:普通流(相对定位实际上看做普通流定位模型的一部分)浮动(float)绝对定位(固定定位是绝对定位的一种)所以在学习浮动之前,我们先要了解块级元素与内联元素(行内元素).块 ...
- display:inline与display:block——行内元素显示与块级元素显示
display:inline 的作用是设置对象做为行内元素显示,inline是内联对象的默认值(ps:内联对象就是不自动产生换行的元素,比如span) 而我们一般用的div是块级元素,默认displa ...
- 块级元素和行内元素的区别 (block vs. inline)
块级元素 (display: block) 独占一行,多个block元素会各自新起一行.默认情况下,block元素的宽度会填满父元素的宽度. 可以设置width, height属性.但是,即使设置了w ...
- block(块级元素)和 inline(内联元素) 的区别
block(块级元素)和 inline(内联元素) 的区别 (2009-01-05 10:32:07) 转载▼ 标签: 杂谈 分类: div+css div这样的块级元素,就会自动占据一定矩形空间,可 ...
- inline(内联元素)和block(块级元素) 的区别
块级元素,默认是独自占据一行的.比如是<p>.<h1>.<h2>.<h3>.<h4>.<h5>.<h6>.<u ...
随机推荐
- Become a Better Programmer: 5 Essential Methods at a Glance--reference
http://www.git-tower.com/blog/become-a-better-programmer-5-essentials/ Become a Better Programmer: 5 ...
- [转]ASP.NET MVC 5 List Editor with Bootstrap Modals
本文转自:https://www.codeproject.com/articles/786085/asp-net-mvc-list-editor-with-bootstrap-modals With ...
- javascript window.open in safari
在ios系统中,无法使用 window.open 打开url,经过一番尝试终于找到了解决办法 var url='http://www.baodu.com'; var deviceAgent = nav ...
- 浅谈------location
今天在上班的时候碰到了要根据不同的页面随机添加栏目的问题,很简单的问题,想到了判断页面url是否含有某字符串来进行随机添加栏目...这就需要了解location对象. location 属性名 属性说 ...
- mvc 中Request[""]与Request.QueryString[""]
1.Request[""]与Request.QueryString[""]获取不到值时返回null: 2.Request[""]与Reque ...
- ThreadPoolExecutor(上篇)
Java有两个线程池类:ThreadPoolExecutor和ScheduledThreadPoolExecutor,继承AbstractExecutorService类,AbstractExecut ...
- maven项目的创建
·做了两年多Java Web一多半的项目都是SSM架构的,只搭建过两次,趁着周末做个总结整理. Eclipse搭建Maven项目 1.new project --> Maven project ...
- win7上装红米4手机驱动提示空间不足
首先说:小米的垃圾支持.我在支持页面上看着 miuiV4或V5版本,再看我手机上9.5的版本.就感觉有些不妙. 下载下来后,点击安装程序,提示我安装空间不足......我F盘可用空间140G,不够你造 ...
- collectd配置
udp proxy - 192.168.48.112 cat > /etc/collectd_25801.conf << EOF Hostname "kvm-48-112& ...
- 【Spring实战】—— 8 自动装配
本篇介绍一下自动装配的知识,Spring为了简化配置文件的编写.采用自动装配方式,自动的装载需要的bean. 自动装配 有以下几种方式: 1 byName 通过id的名字与属性的名字进行判断,要保证B ...