前端学习Day7

块元素和内联元素

  • 块元素是指独占一行的元素,无论其内容多少都会独占一行
  • 常见款元素:

div 、p 、h1到h5

  • div属于典型的块元素

特点:与其他块元素相比,div不存在任何语义,不会对标签内的内容设置任何默认的样式
存在的目的就是为了实现页面布局

  • 内联元素是指只占其自身大小的元素
  • 常见的内联元素:

span、a、img、iframe

  • span 属于典型的内联元素

特点:与其他的内联元素相比,span无任何实际语义
span标签是用来选中文本,然后为选中的文本设置样式

  • 两者的区别与联系:
    div是块元素,是用于页面布局的,span是内联元素用于选中文本并为其设置样式

1.一般情况下只有块元素包含内联元素,而内联元素不能包含块元素

  1. a元素是属于内联元素,但是a元素可以包含任何元素,除了它自身

3.p元素不能包含块元素

  • 正确代码示例:
<div  style="color:red">
<p>我是圆圆爸爸</p>
</div>

<hr/>
<p>我是骑猪的爸爸,<span  style="font-size:40px">我的孩子叫圆圆,祝他顺利诞生!</p>

<hr/>
<a href="#">
<div>我是骑猪的爸爸</div>
</a>
<a href="#">
<p>我是骑猪的爸爸</p>
</a>
  • 错误代码示例:
<span>
         <div>
           </div>
</span>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 本课来自http://www.imooc.com/learn/9请不要用作商业用途。 HTML5 HTML介绍 H...
    PYLON阅读 3,342评论 0 5
  • 浏览器与服务器的基本概念 浏览器(安装在电脑里面的一个软件) 作用: ①将网页内容渲染呈现给用户查看。 ②让用户通...
    云还灬阅读 1,167评论 0 0
  • •前端面试题汇总 一、HTML和CSS 21 你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? ...
    Simon_s阅读 2,239评论 0 8
  • 本文主要是起笔记的作用,内容来自慕课网. 认识CSS样式 CSS全称为“层叠样式表 (Cascading Styl...
    0o冻僵的企鹅o0阅读 2,676评论 0 30
  • ## css学习记录一 ### 写在前面 CSS(cascading style sheets)层叠样式表 可以为...
    无名小卒go阅读 263评论 0 0