2016年11月16日,星期三


    对今天所学课程的总结:

    一、①块级元素表示:block.

        ②行内元素表示:inline.

        ③行内块级元素表示:inline-block.

     二、

<div></div>属于块级元素,<span></span>属于行内元素,但是文字不换行。

   在样式中display:block;是将行内元素转化为块级元素,但是文字不换行。

 <!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <style>

        div{

            height: 100px;

            width: 200px;

            background-color: yellow;

            display: inline-block;

        }

        span{

            width: 200px;

            height: 100px;

            background-color: red;

            display: block;

        }

</style>

</head>

<body>

<!-- 块级元素 若想变为行内块级元素只需在style中加入display:inline-block属性(特点:具有款及元素的特点,但不能自动换行。)-->

<div></div>

<!-- inline行内元素 不能设置宽高,但可以加入背景色。span不能自动换行,但若想变为div形式的块级元素,可在style中加入display:block属性-->

<span>sss</span>

</body>

<html>