其实在网页中有看不见的基线，就像作业本上面的一行一行的线，但是我们看不见。

div是块状元素，独占一行，用div控制文字的颜色会使得文字换行，使用float可以改善，但是它不会浮在相应的位置；

<style>
#test1{
color:red;
float:left;
}
#test2{
color:blue;
}
</style>
</head>
<body>
<div>
北方有<div id="test1">佳人</div>，绝世而独立。</br>
一顾倾人城，再顾倾人国。</br>
宁不知倾城与倾国，<span id="test2">佳人</span>难再得。</br>
</div>
</body>

span行内元素，只在一行中发挥作用，设置高宽此时没有作用，因为行高已经定了；

<style>
#test1{
color:red;
}
#test2{
color:blue;
}
</style>
</head>
<body>
<div>
北方有<span id="test1">佳人</span>，绝世而独立。</br>
一顾倾人城，再顾倾人国。</br>
宁不知倾城与倾国，<span id="test2">佳人</span>难再得。</br>
</div>
</body>

inline--行内元素的更多相关文章

  1. block与inline，inline和inline-block，块级和行内元素，行内替换和行内非替换元素

    block:块级元素默认display属性为block:无论块内内容有多少,总是占满一行: inline:行内元素默认display属性为inline:只占据块内的内容的大小,不会占满一整行: inl ...

  2. CSS样式设置语法全解，样式优先级、值和单位、字体、文本、块级元素，行内元素，替换元素、非替换元素、display、float、position、table、li、光标、边距边框、轮廓、颜色背景

    全栈工程师开发手册 (作者:栾鹏) 一个demo学会css css选择器全解 css操作语法全解 CSS样式设置语法全解: 样式优先级 1. !important标记的样式 > 内联样式(sty ...

  3. html：块级元素和行内元素的特点

    display:block: 块元素会独自占据一整行,或者多行,可以任意设置其大小尺寸,是用于搭建网页布局的必须部分,使网页结构更加紧凑合理. 块级元素width.height.padding.mar ...

  4. 前端css之文本操作及块级元素和行内元素

    1.文本操作 1.1文本颜色(color) 颜色指定方式: 十六进制值 - 如: #FF0000 一个RGB值 - 如: RGB(255,0,0) 颜色的名称 - 如:  red 1.2水平对齐方式 ...

  5. 【css】主要的块状元素(block element)和内联元素(inline element行内元素)

      内联元素:只在行内发生作用,设置宽高不起作用,不会影响文字内容,使其换行等.竖直方向和间距也不起作用   display可以强制转换行内元素和块状元素,还可以取消显示none   块元素(bloc ...

  6. CSS中的块级元素（block）与行内元素（inline）

    css中有3种基本的定位机制:普通流(相对定位实际上看做普通流定位模型的一部分)浮动(float)绝对定位(固定定位是绝对定位的一种)所以在学习浮动之前,我们先要了解块级元素与内联元素(行内元素).块 ...

  7. display:inline与display:block——行内元素显示与块级元素显示

    display:inline 的作用是设置对象做为行内元素显示,inline是内联对象的默认值(ps:内联对象就是不自动产生换行的元素,比如span) 而我们一般用的div是块级元素,默认displa ...

  8. 块级元素和行内元素的区别 (block vs. inline)

    块级元素 (display: block) 独占一行,多个block元素会各自新起一行.默认情况下,block元素的宽度会填满父元素的宽度. 可以设置width, height属性.但是,即使设置了w ...

  9. 行内元素(inline标签)设置了行高为什么不生效，还是表现为父盒子的行高？行内元素行高问题终极解释

    最近在看张鑫旭大佬的<css世界>,读到5.2.4  内联元素 line-height 的“大值特性” ,产生了疑惑, 在开发中确实也遇到了同样的问题,深入探究后得出结果,先说结论吧,论证 ...

  10. CSS中定位和浮动对行内元素的宽高的影响

    行内元素的大小是由元素里面的内容撑开的宽高决定的,就算在css中对行内元素设置width,height.行内元素也会忽略宽高的设置. 但是当行内元素使用position:absolute或者posit ...

随机推荐

  1. sqlserver2000 数据库 'tempdb' 的日志已满

    方法一解决过程: 查看了下数据库的属性,是自动增长,不指定文件大小上限.在网上Google了很久,试了些方法都不行:数据库所在磁盘还有很大的可用空间,试着下重药了.直接把tempdb的数据文件和日志文 ...

  2. Sass中文乱码问题（手动编译和watch编译）

    一.sass手动编译出错 .scss文件中含有中文的时候编译报错(比如注释,比如字体栈),比如: foo.scss: 编译: 解决办法: 找到类似这个的路径的文件(仅供参考,不同环境可能不同): C: ...

  3. nginx 反向代理 配置 https 实现http https同时存在

    server { listen ssl; #监听443端口 server_name www.app01.com; ssl on; #启用ssl加密 ssl_certificate /etc/cert/ ...

  4. Asp.net导出Excel续章（自定义合并单元格，非Office组件）

    结合上次写的导出Excel方法,这次上头要求我将列头进行一下合并 以前的效果: 改进后的效果: 在上篇文章中写到了Excel的导出方法,这次为了避免在生产环境中使用Office组件,服务器各种权限配置 ...

  5. BZOJ 2844 albus就是要第一个出场 ——高斯消元 线性基

    [题目分析] 高斯消元求线性基. 题目本身不难,但是两种维护线性基的方法引起了我的思考. void gauss(){ k=n; F(i,1,n){ F(j,i+1,n) if (a[j]>a[i ...

  6. iOS @@创建NSURL的字面量

    @@ 是创建 NSURL 的字面量的绝佳方法(例如:@@"http://example.com")

  7. Apache rewrite

    Apache rewrite mod_rewrite简介和配置 实URL跳转隐藏真实地址 拟目录 域名跳转 防止盗链 Apache配置支持httpd.conf配置.htaccess配置 启用rewri ...

  8. win8 系统安装node环境记录

    原先我是用win7环境安装node很方便,到了win8系统突然变了,让我顿时困惑了一段时间,但还是被我找到方式解决了,记录一下解决方案: 首先在网上看了一些资料说win8下安装node环境会出错,但我 ...

  9. NOIP2012拓展欧几里得

    拉板题,,,不说话 我之前是不是说过数据结构很烦,,,我想收回,,,今天开始的数论还要恶心,一早上听得头都晕了 先来一发欧几里得拓展裸 #include <cstdio> void gcd ...

  10. 提高C#代码质量-规范

    [规范习惯]命名规范1-命名空间 使用<Company>.<Component>2-程序集不必与命名空间同名3-命名空间使用附复数4-避免与FCL的类型重名5-类型名称用名词6 ...