html块

  • html块元素

块元素在显示时，通常会以新行开始

如：<h1>、<p>、<ul>

  • html内联元素

内联元素头通常不会以新行开始

如：<b>、<a>、<img>

  • html<div>元素

<div>元素也被称为块元素，其主要的是组合html元素的容器

  • html<span>元素

<span>元素是内联元素，可作为文本的容器

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title>块元素</title>

    <link rel="stylesheet" type="text/css" href="mycss02.css">

</head>

<body>

    <!-- 块 -->

    <p>hello</p>

    <h3>world</h3>

    <b>这是一个</b>

    <a>zheshiyige </a>

    <div id="divID">

        <p>hello world</p>

        <a href="http://baidu.com">点击我</a>

    </div>

    <div id="divspan">

        <p><span>这是一个测试</span>程序编后话</p>

    </div>

</body>

</html>
<p>hello</p>、<h3>world</h3>是块元素，他们之间不会在同一行，有新行开始。<b>这是一个</b>、<a>zheshiyige </a>不会换行，如图：

div通过css设置，设置一个id，id="divID"，通过<link rel="stylesheet" type="text/css" href="mycss02.css"> </head>引入，就可以在css中设置编辑

#divID a {

    color: red;

}

#divID p{

    color: gold;

}

#divspan span{

    color: magenta;

}

上述就是css的内容，其中#divID a { color: red; }定义了<a></a>中的内容颜色为red，<p></p>中的颜色为gold；<span></span>中颜色为magenta。如图：

本站文章为宝宝巴士 SD.Team原创，转载务必在明显处注明：（作者官方网站：宝宝巴士)

转载自【宝宝巴士SuperDo团队】 原文链接: http://www.cnblogs.com/superdo/p/4752981.html

html5学习之路_002的更多相关文章

  1. HTML5学习之路

    出于公司项目需求,我现在开始学习html5,虽然零零散散有过一点,比如说新出的语义化标签,本地存储之类的,但是从来都没有系统的去了解.

  2. html5学习之路_001

    安装环境 安装intellij idea作为开发环境 打开环境 新建一个html文件,打开之后出现代码框架,再次基础上继续编码即可,例如: <!DOCTYPE html> <html ...

  3. html5学习之路_007

    CSS概述 CSS指层叠样式表 CSS样式表极大地提高了工作效率 CSS基础语法 selector { property:value } 例:hi {color:red; font-size:14px ...

  4. html5学习之路_006

    表单与php交互 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  5. html5学习之路_005

    PHP环境搭建 1.下载安装xampp 2.打开xampp,开启mysql和apache 3.在开发环境eclips中下载插件 4.安装php 5.切换到php开发环境 6.创建一个php项目 7.打 ...

  6. html5学习之路_004

    HTML表单 表单用于获取不同类型的用户输入 常用表单标签 下面为一个简单的表单: <!DOCTYPE html> <html> <head lang="en& ...

  7. html5学习之路_003

    html布局 使用<div>元素布局 使用<table>元素布局 <div>元素布局 <!DOCTYPE html> <html> < ...

  8. 8年，从2D到3D，我的学习之路

    Mickey 写了一篇 <一个本科毕业生创业两年的感悟>,从他的视角,总结了我们合作的两年经历. 我也来写一篇,介绍我的学习之路,希望对大家有所帮助,谢谢大家- 我的学习方法 1.直接从0 ...

  9. springboot 学习之路 8 (整合websocket(1))

    目录:[持续更新.....] spring 部分常用注解 spring boot 学习之路1(简单入门) spring boot 学习之路2(注解介绍) spring boot 学习之路3( 集成my ...

随机推荐

  1. 题解 P2261【[CQOI2007]余数求和】

    P2261[[CQOI2007]余数求和] 蒟蒻终于不看题解写出了一个很水的蓝题,然而题解不能交了 虽然还看了一下自己之前的博客 题目要求: \[\sum_{i=1}^{n}{k \bmod i} \ ...

  2. 将A页面提交的数据id传递到B页面

    A页面 在A页面跳转到B页面的时候,在url后面可以拼接参数 例如: window.location.href = './B.html?' + id; 跳转到B页面之后,可以通过url地址获取到从A页 ...

  3. 线程池（Java中有哪些方法获取多线程）

    线程池(Java中有哪些方法获取多线程) 前言 获取多线程的方法,我们都知道有三种,还有一种是实现Callable接口 实现Runnable接口 实现Callable接口 实例化Thread类 使用线 ...

  4. C/S程序设计范式

    在socket编程之并发回射服务器3篇文章中,提到了3种设计范式: 多进程 父进程阻塞于accept调用,然后为每个连接创建一个子进程. 多线程 主线程阻塞于accept调用,然后为每个连接创建一个子 ...

  5. 大batch任务对structured streaming任务影响

    信念,你拿它没办法,但是没有它你什么也做不成.—— 撒姆尔巴特勒 前言 对于spark streaming而言,大的batch任务会导致后续batch任务积压,对于structured streami ...

  6. basicRF双向灯光控制

    题目: 实现基于BasicRF无线点对点通信的双向灯光控制,具体要求如下: 1> 节点A 和节点B 的PANID设置为0x1234,通道号设置为17,节点地址自定义.<2> 按下节点 ...

  7. Json格式数据的解析

    JSON是一种轻量级的数据交换格式,我们在编程中遇到的JSON数据通常就是一串字符串,只不过按照特定的格式去书写,这样当你把JSON数据传输给别人的时候对方只要使用这种特定的规则去阅读解析你的数据即可 ...

  8. 软路由OpenWrt（LEDE）2020.5.10更新 UPnP+NAS+多拨+网盘+DNS优化

    近期更新:2020.05.10更新-基于OpenWrt R2020.5.9版本,源码截止2020.05.10.   交流群:QQ 1030484865 电报 t.me/t_homelede   版本说 ...

  9. Numpy-np.random.normal()正态分布

    X ~ :随机变量X的取值和其对应的概率值P(X = ) 满足正态分布(高斯函数) 很多随机现象可以用正态分布描述或者近似描述 某些概率分布可以用正态分布近似计算 正态分布(又称高斯分布)的概率密度函 ...

  10. 真正免费，不限页数的PDF转Word工具

    真正免费,不限页数的PDF转Word工具 我们知道PDF转Word工具非常多,但大部分都有各种限制,限大小,限页数,加水印等等. 这其中绝大部分其实并不能做到格式完全一样,遇到图片更是直接傻了. 我们 ...