欢迎您访问 最编程 本站为您分享编程语言代码,编程技术文章!
您现在的位置是: 首页

第 3 节 块级标记和行内标记

最编程 2024-10-14 07:10:12
...

块级标签

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>块级标签div</title>

    <!-- 很重要   div 分区,分块的意思    对网页内容进行划分和布局 -->

     <!--

         div  作用:主要是与CSS结合来进行一些布局

            等价于一个容器,里面可以包含其他标签(这个其他标签包含div本身),用来结合CSS修饰写在它内部其他结构

            div 的重要性和作用,主要取决于我们对其进行一个怎样的布局

            -->

</head>

<body>

    <div style="width: 200px; height: 200px; border: 1px solid red;"> div  </div>

    <!-- 像这样一个代码就是我们CSS中所要学习的  写的是一个200像素*200像素  边框为1像素宽的 实线红色边框,边框内写了一个div 的内容 -->

</body>

</html>

行内标签

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>行内标签</title>

    <!--  行内标签 span:

      作用: (主要是对行内文本进行样式修饰)

         1.作为文本字体的容器,用来结合CSS修饰文本

         2.根据行内标签的特性,做微小布局

                        特性:1. 不换行

                              2.部分块级样式不生效,如设置像之前块级标签内的 200px的东西 宽高等  

                                (这类称为部分块级样式的东西,之后讲CSS 的时候会细讲)

       -->

</head>

<body>

    <span style="font-size: 80px; color: aquamarine;">wei  jin  yu</span>

    <span >wei  jin  yu</span>

</body>

</html>

推荐阅读