块元素的基本语法

1. Html块元素 ,块元素在开始时候通常以新行开始,比如h1,p,ul

2.内联元素,通常不会以新行开始,比如a,b,img

3.html的div元素,div也被称为块元素,其主要作为组合html元素的容器

4.html的span元素,span元素是内联元素,可作为文本的容器

!!!!!!代码实例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>H5块元素</title>
    <link rel="stylesheet" type="text/css" href="myStyle.css">
    <style>
        span{
            color:chartreuse;
        }
    </style>
</head>
<body>
    <p>这是一个段落</p>
    <h1>这是一个标题</h1>
    <b>这是一个加重</b>
    <a>这是一个超链接</a>
    <div id="divId">
        <p>
            这是一个段落
        </p>
        <a>这是一个超链接</a>
    </div>
    <div>
        <P><span>这是一个span测试,</span>测试效果</P>
    </div>
</body>
</html>

css代码

#divId p{
    color:red;
}

divId是di的id,后面的p是指定P标签

效果图

H5学习之旅-H5的块标签的使用(9)的更多相关文章

  1. H5学习之旅-H5的基本标签(2)

    H5的标签和html的标签没什么区别,主要介绍H5的基本标签 1.基础标签header和body,header的<title>元素主要是显示在标签页面里面,以及设置使用的语言和编码格式.b ...

  2. H5学习之旅-H5的新特性(1)

    随着H5的发展,网页开发呈现了跨平台的特性,目前H5是兼容各大平台的,这也为一些其他的技术的跨平台开发提供了基础,所以我预测后H5会成为很重要的开发语言 新特性介绍 1.用于回话的canvas标签 2 ...

  3. H5学习之旅-H5列表(8)

    列表的基本语法 ol:有序列表 ul:无序列表 li:列表项 dl:列表 dt:列表项 dd:列表描述 常用列表 1.无序列表:使用标签 ul,li 属性:disc(默认实心圆) circle (空心 ...

  4. H5 学习之旅-H5表格(7)

    表格语法 table:简历表格 captian:表格标题 th:表格行表头 tr:表格行 td:单元格 thead:表格页眉 tfoot:表格页脚 tbody:表格主体 col:列属性 !!!代码实例 ...

  5. H5学习之旅-H5的超链接以及图片链接(6)

    链接内容 1.文本链接 2.图片链接 属性 href:指向另一个文档的链接 name:文档内部的链接 img标签属性 alt:替换文本属性 width:宽 height:高 代码实例 <!DOC ...

  6. H5学习之旅-H5的框架(13)

    H5框架语法介绍 :frame:框架对于页面的设计有很大的作用 frameSet:框架集标签定义如何将窗口分割为框架 ,每一个frameset定义一些列行或者列,rowS/COLS规定了每行或者每列占 ...

  7. H5学习之旅-H5的表单(11)

    H5的表单元素 form:表单 input:输入域,type属性可以设置text,password,button等不同的属性 textarea:文本域 lable:控制标签 fieldset:定义域 ...

  8. H5学习之旅-H5的样式(5)

    样式的引入方式 外部样式表 link rel = "stylesheet" type = "text/css" href = "mystyle.css ...

  9. H5学习之旅-H5的格式化(4)

    H5的格式设置: b代表是粗体 i斜体 big 字体变大 small变小 em强调 strong 加强和变粗差不多 sub 定义下标字 sup 定义上标字 ins 插入字 del 删除字 代码实例 & ...

随机推荐

  1. 推荐几种PHP实现页面跳转的方法

    1.PHP实现页面跳转第一种方法 <?php header("Location:http://www.baidu.com"); ?> header()是php内置函数, ...

  2. python3+django2 开发易语言网络验证(上)

    创作背景: 在某论坛中下载到一套php开发易语言网络验证的教程,照着看下来,花了两天的时间,结果发现教程里开发的网络验证,以及随着教程一起给学员的源码,都存在着根本用不了的bug!我想要看看能不能在原 ...

  3. android注解入门 并来自己写一个框架

    介绍 这里我带大家来学习一下注解 并且用来写下一个模仿xUtils3 中View框架 此框架 可以省略activity或者fragment的 findViewById 或者设置点击事件的烦恼 我正参加 ...

  4. Android简易实战教程--第四十七话《使用OKhttp回调方式获取网络信息》

    在之前的小案例中写过一篇使用HttpUrlConnection获取网络数据的例子.在OKhttp盛行的时代,当然要学会怎么使用它,本篇就对其基本使用做一个介绍,然后再使用它的接口回调的方式获取相同的数 ...

  5. protobuf中的枚举缺省值应该为UNKNOWN

    protobuf中的枚举缺省值应该为UNKNOWN(金庆的专栏)proto3中的枚举值为了与proto2兼容,要求缺省值固定为第1个,值为0.proto2中并没有规定对范围之外的枚举值的处理,而pro ...

  6. LuaHotUpdate原理

    LuaHotUpdate原理(金庆的专栏)项目地址:https://github.com/asqbtcupid/lua_hotupdate只更新函数,不更新数据.主页上有个动画演示.限Windows平 ...

  7. 分析MapReduce执行过程+统计单词数例子

    MapReduce 运行的时候,会通过 Mapper 运行的任务读取 HDFS 中的数据文件,然后调用自己的方法,处理数据,最后输出.Reducer 任务会接收 Mapper 任务输出的数据,作为自己 ...

  8. Dynamics CRM2013 在Visual Studio中开启脚本的Xrm.Page智能提示

    前面篇博文http://blog.csdn.net/vic0228/article/details/49663751提到了通过引用XrmPage-vsdoc.js文件来启用Xrm.Page的智能提示, ...

  9. Gradle 的Daemon配置

    最近升级到Android 2.2.2之后,运行之前的项目特别卡,基本上2分钟,好的时候1分半,查询了Android官网的说明说daemon能够加快编译.于是我也尝试开启Daemon. 在Windows ...

  10. Android中PropertyAnimation属性动画详解(一)

    在之前的文章中已经讲了帧动画frame-by-frame animation和补间动画tweened animation,其实这两种动画原理好简单,都是按照预先固定的动画模式来播放的,帧动画将一张张单 ...