---恢复内容开始---

1.块元素

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

　　如：<h1> <p> <ul>

　　　　<!-- 块—>注释

　　　　<p>hello</p>

　　　　<h1>world</h1>

　　出来的结果是:

　　hello

　　空一行

　　world

　　hello 和world 之间有新的一行

2.HTML内联元素

　　内联元素通常不会以新行开始 如<b> <a> <img>　

<b>这是一个加重标签</b>
<a>哈哈</a>

　　结果是 　　这是一个加重标签 哈哈

　　没有 再起一行

3. HTML <div>元素

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

4.HTML<span>元素

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

　　例子：

　　代码：

　　

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- 块-->
    <title>块元素</title>
    <style type = text/css>
        span{
            color: aqua;
        }
    </style>
</head>
<body>
    <p>大家好!</p>
    <h1>的第三款了你的扣篮考虑到那看的扣篮了卡单身快乐你登陆看两三款单你卡上</h1>
    <b>这是一个加重标签</b>
    <a>哈哈</a>
    <div>
        <p>
            极客学院
        </p>
    </div>
    <div>
        <p>
           <span>
            这是一个测试结果
           </span>
            span 是一个什么样子
        </p>
    </div>
</body>
</html>

5.DIV元素布局 和 table元素布局

DIV布局：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>div布局</title>
    <style type = "text/css">
        body{
            margin: 0px;
        }
        #container{
            width: 100%;
            height: 950px;
            background-color: lightgray;
        }
        #heading{
            width: 100%;
            height: 10%;
            background-color: aqua ;
        }
        #content_menu{
            width: 30%;
            height: 80%;
            background-color: aquamarine;
            float: left;
        }
        #content_body{
            width: 70%;
            height: 80%;
            background-color: blueviolet;
            float: left;
        }
        #footing{
            width: 100%;
            height: 10%;
            background-color: black;
            clear: both;
        }
    </style>
</head>
<body>
    <div id = "container" >
        <div id="heading">头部</div>
        <div id=" content_menu">内容菜单</div>
        <div id="content_body">内容主题</div>
        <div id="footing">底部</div>

    </div>
</body>
</html>

其中：
在html中常用于布局、定位、区分。DIV是层叠样式表中的定位技术，全称DIVision，即为划分。有时可以称其为图层。
个人感觉像OC里面的View。
在上面 container 为最外层的View 相当于OC一个ViewController的View，id = "container" 个人CO理解的是 这块View 的name 叫 container，
<div id="heading">头部</div> 理解的是 一块叫heading的view 里面 加了一个label ， label的内容显示的是 头部，
  #footing{
            width: 100%;
            height: 10%;
            background-color: black;
            clear: both;
        }
这块代码的OC理解就是拿到footing的地址，对这块View做布局和颜色等等的操作。
# 就相当于 OC 里面的 * 
footing 就相当于下面的 view（地址名字）
UIView *view = [UIView new];
CGRect frame = controller.view.bounds;
frame.size.width = controller.view.frame.size.width
frame.size.height = controller.view.frame.size.height * 0.1
view.backGroundColor = [UIColor blackColor];
得在body 使用DIV标签（标签里面声明 view），在head 里面设置 DIV标签的一些属性.
浏览器的结果是： 去掉 黑色上面 那一栏 就把2个图片综合一下



table布局：


　　


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>table布局</title>
</head>
<body marginheight="0px" marginwidth="0px">
    <table width="100%" height = "950px" style="background-color: lightgray">
    <tr>
        <td colspan="3" width="100%" height="10%" style="background-color: aqua">这是头部</td>
    </tr>
        <tr>
            <td width="30%" height="80%"style="background-color: blue">
                <ul>
                    <li>iOS</li>
                    <li>HTML5</li>
                    <li>swift</li>
                </ul>

            </td>
            <td width="60%" height="80%" style="background-color: blueviolet">主题内容</td>
            <td width="20%" height="80%" style="background-color: deeppink">右菜单</td>
        </tr>
        <tr>
            <td width="100%" height="10%" colspan="3" style="background-color: darkcyan">这是底部</td>
        </tr>
    </table>

</body>
</html>


<body>里面 给一个table


<table width="100%" height = "950px" style="background-color: lightgray"> 设置tale 的 宽和高 PX就像素


100%就是全屏的宽度 * 1


<tr>是表格的一行,放在table或者body标签里面的


<td> 标签定义 HTML 表格中的标准单元格。td 元素中的文本一般显示为正常字体且左对齐。


HTML 表格有两类单元格：


  • 表头单元 - 包含头部信息（由 th 元素创建）
    • 

  • 标准单元 - 包含数据（由 td 元素创建）


 




　　


---恢复内容结束---
												


											
6、HTML5表单提交和PHP环境搭建的更多相关文章
	

    
						
  1. HTML5表单提交和PHP环境搭建
		
    HTML5表单提交相关内容和PHP环境搭建需要的软件(只备注) (2)举例介绍 (3)PHP环境搭建
    
		
    2. 
						
  2. HTML5表单提交与PHP环境搭建
		
    PHP服务器使用xampp集成套件 路径 D:\xampp\htdocs\MyServer\index.php 访问 http://localhost/MyServer/index.php 能够正常显 ...
    
		
    3. 
								
  3. HTML5 表单提交实例
		
    html <!DOCTYPE html> <html> <head> <title>表单</title> <meta charset= ...
    
		
    4. 
						
  4. Spring Boot 2 + Thymeleaf：表单字段绑定、表单提交处理
		
    Spring Boot中Thymeleaf对表单处理的一些用法:(1)使用th:field属性:进行表单字段绑定(2)使用ids对象:一般用于lable配合radio或checkbox使用(3)表单提 ...
    
		
    5. 
						
  5. HTML5：表单提交
		
    不加CSS.JavaScrips的HTML表单提交简单代码 <!DOCTYPE html> <html lang="en"> <head> &l ...
    
		
    6. 
						
  6. 实现跨浏览器html5表单验证
		
    div:nth-of-type(odd){ float: left; clear: left; } .origin-effect > div:nth-of-type(even){ float:  ...
    
		
    7. 
						
  7. jQuery html5Validate基于HTML5表单验证插件
		
    更新于2016-02-25 前面提到的新版目前线上已经可以访问: http://mp.gtimg.cn/old_mp/assets/js/common/ui/Validate.js demo体验狠狠地 ...
    
		
    8. 
						
  8. 第6章—渲染web视图—SpringMVC+Thymeleaf 处理表单提交
		
    SpringMVC+Thymeleaf 处理表单提交 thymleaf处理表单提交的方式和jsp有些类似,也有点不同之处,这里操作一个小Demo,并说明: 1.demo的结构图如下所示: pom.xm ...
    
		
    9. 
						
  9. HTML5表单
		
    1.placeholder placeholder="e.g. King Kong" 只需在input元素中加入placeholder属性,其属性值就会默认显示为占位符文字,输入框 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. Android 进程常驻----native保活5.0以下方案推演过程以及代码
			
    正文: 今天继续昨天,一鼓作气,争取这个礼拜全部写完. 上一篇文章留了一个别人的github链接,他里面的native保活实现方案也是大多数公司采用的方案. 我们先来讲一下他的方案. 他是首先开启一个 ...
    
			
    2. 
						
  2. spring mvc文件上传
			
    package com.haier.controller.newuser; import com.haier.commons.entity.Response; import com.haier.com ...
    
			
    3. 
						
  3. maven创建子项目(适用于多模块管理项目)
			
    在eclipse或者myeclipse下构建maven项目,该项目由多个子模块组成. 1.创建一个父项目 NEW -->project-->maven-->maven Project ...
    
			
    4. 
						
  4. 删除github仓库中的某个文件夹
			
    最近在做一个项目,由于前期文件夹名是中文,如下:    |---Repository       |--- React单页面音乐播放器 并且git push到了github上. 后来在本地把文件夹re ...
    
			
    5. 
						
  5. 解决iphone5s,iphone6不能使用luajit及luac的问题
			
    做手游有小段时间了,感觉坤哥给这么多的机会.一直都比较忙项目的事,比较没时间去写点东西做点记录.想想还是写点开发问题记录比较好,可以很简短,也可以很有用. 我们项目采用的cocos2d-x的引擎,之前 ...
    
			
    6. 
						
  6. 个人博客作业Week1
			
    个人博客作业Week1 一.问题 通读<构建之法>我有一下几个问题 PM没有参与代码编如何进行管理. 软件工程师的职业资格考试对我们来说很有必要吗. 当我们为用户开发软件时我们需要了解用户 ...
    
			
    7. 
						
  7. 主流的单元测试工具之-JAVA新特性-Annotation 写作者：组长 梁伟龙
			
    1:什么是Annotation?Annotation,即“@xxx”(如@Before,@After,@Test(timeout=xxx),@ignore),这个单词一般是翻译成元数据,是JAVA的一 ...
    
			
    8. 
						
  8. 慕课网__CSS_网页图标制作
			
    参考地址:http://www.flowerboys.cn/font/article/fontsArticle/how-to-turn-your-icons-into-a-web-font.html
    
			
    9. 
						
  9. mybatis入门_一对多,多对多映射以及整合spring框架
			
    一.一对多映射. 1.1 一对多映射之根据多的一方关联查询一的一方 示例:查询出具体的订单信息,同时也查询出来订单的用户信息. 引入的订单表如下所示: 框选出来的为具体的外键. 订单的Pojo类如下所 ...
    
			
    10. 
						
  10. 转：ProgressMonitorDialog
			
    http://stackoverflow.com/questions/12986912/using-progressmonitordialog-in-eclipse-4-properly public ...
    
			
    11.