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

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. HTML5表单提交与PHP环境搭建

    PHP服务器使用xampp集成套件 路径 D:\xampp\htdocs\MyServer\index.php 访问 http://localhost/MyServer/index.php 能够正常显 ...

  3. HTML5 表单提交实例

    html <!DOCTYPE html> <html> <head> <title>表单</title> <meta charset= ...

  4. Spring Boot 2 + Thymeleaf:表单字段绑定、表单提交处理

    Spring Boot中Thymeleaf对表单处理的一些用法:(1)使用th:field属性:进行表单字段绑定(2)使用ids对象:一般用于lable配合radio或checkbox使用(3)表单提 ...

  5. HTML5:表单提交

    不加CSS.JavaScrips的HTML表单提交简单代码 <!DOCTYPE html> <html lang="en"> <head> &l ...

  6. 实现跨浏览器html5表单验证

    div:nth-of-type(odd){ float: left; clear: left; } .origin-effect > div:nth-of-type(even){ float: ...

  7. jQuery html5Validate基于HTML5表单验证插件

    更新于2016-02-25 前面提到的新版目前线上已经可以访问: http://mp.gtimg.cn/old_mp/assets/js/common/ui/Validate.js demo体验狠狠地 ...

  8. 第6章—渲染web视图—SpringMVC+Thymeleaf 处理表单提交

    SpringMVC+Thymeleaf 处理表单提交 thymleaf处理表单提交的方式和jsp有些类似,也有点不同之处,这里操作一个小Demo,并说明: 1.demo的结构图如下所示: pom.xm ...

  9. HTML5表单

    1.placeholder placeholder="e.g. King Kong" 只需在input元素中加入placeholder属性,其属性值就会默认显示为占位符文字,输入框 ...

随机推荐

  1. python 学习笔记十五 web框架

    python Web程序 众所周知,对于所有的Web应用,本质上其实就是一个socket服务端,用户的浏览器其实就是一个socket客户端. Python的WEB框架分为两类: 自己写socket,自 ...

  2. 【前端】使用CSS使元素居中的几种方式

    Precondition: <div class="parent"> <div class="item">居中</div> ...

  3. cmd部分提权常用命令

    ipconfig 显示本地IP地址 net start telnet 开telnet服务 net use z:127.0.0.1c$ 映射对方的C盘 net user 查看所有用户列表 net use ...

  4. juqery模板 Templates

    现在已经有了许多JavaScript的解决方案模板,从这方面说,标准化的模板解决方案必然是大势所趋.在本节中,我们向你简要描述四个最流行最有趣的模板.现有的模板解决方案能解决什么?那些特色在jQuer ...

  5. h5移动端让文字不可选中复制

    可以用css属性来控制 -moz-user-select:none; -webkit-user-select:none;

  6. CSS里width: auto\9 是什么意思

    color:red;//一般浏览器识别,字体颜色为红color:blue \9;//IE8,IE9及以上版本识别,字体颜色为蓝*color:orange;//IE7识别,字体颜色为橘色_color:b ...

  7. Nginx基础知识之————RTMP模块中的中HLS专题(翻译文档)

    一.在Nginx配置文件的RTMP模块中配置hls hls_key_path /tmp/hlskeys; 提示错误信息: nginx: [emerg] the same path name " ...

  8. hdu4087ALetter to Programmers(三维旋转矩阵)

    参考 三维旋转矩阵 + 矩阵加速 这个还要用到仿射变换. 平移 translate tx ty tz 1 0 0 tx 0 1 0 ty 0 0 1 tz 0 0 0 1 缩放 scale kx ky ...

  9. /boot/grub/device.map【设备映射】

    grub-install 安装 GRUB 在第一个硬盘的 MBR: # grub-install '(hd0)' grub-install 会先搜寻设备对应的文件(/boot/grub/device. ...

  10. windows字符串

    CString在win32环境下最大的有效长度应该是INT_MAX-1 一般小于这个长度的文件,处理字符串都没问题. TCHAR字符串数组没有处理子串的相关函数,strchr(_tcschr)只是处理 ...