一、程序的分层
1、界面层：
　　某种类型的应用程序
　　a、DOS(控制台运行)
　　b、桌面应用程序--独立安装，独立运行
　　c、web类型--现在流行的
单机版：电脑上要安装，程序升级之后，电脑上也要升级--桌面应用程序
网络版：电脑上不装，输入一个url地址，直接用--web类型
2、业务逻辑层：数据访问--数据交互
3、数据存储层：myssql jdbc
二、web类型的应用程序：应用程序位于服务器，用户只需要通过浏览器就能访问和交互的
　　理解：和前端网站开发的区别
　　1、网站--最常见
　　2、程序--OA、CRM
三、需要掌握的知识
　　1、客户端：
　　　　页面的创建：搭建--美化--动态的显示效果
　　　　HTML--CSS--JS
　　2、服务器端：页面和数据库的交互--JSP&Servlet>>>>>Ajax&Jqery
　　　　Web基础相关的技术：HTML--CSS--JS 不要求学的很精细，但是前端给你必须能看的懂
　　　　JSP&Servlet对于学Java的必须学
　　　　学习时间：HTML--3天 JS--3天
四、HTML 课程
1、概述：
　　定义：超文本标记语言，一种纯文本类型的语言
　　作用：设计网页
　　特点：文件以.html/htm为后缀；由浏览器解释执行；扩展性很强，可嵌套脚本语言编写程序段，如VBScript,JavaScript
2、web浏览器：
　　主要功能：代理访问者提交请求；作为HTML的解释器和内嵌脚本程序执行器；以图形化界面的方式显示HTML文档
　　主流产品：IE,Firefox,Chrome,Opera,Safari
　　注意：同样的HTML代码在不同的浏览器上，效果上可能有所不同
3、基本概念：
　　标记/标签：<>包围的单词；大多成对，有开始标记和结束标记之分
　　元素：<>包围的部分：<body>body的元素<body/>用谁包围的就称是谁的元素
　　属性：用来修饰元素；每个属性都有值；属性放在开始标签中
　　单标签（空标记）和双标签之分：<br />--标准和<br>--早期版本写法
　　元素和标签的概念并没有严格的区分。
4、HTML的文档结构：
　　版本信息：<!DOCTYPE> 版本声明
　　分类：

　　　    Strict DTD 严格型 按照W3C定义的标准
　　　　Transitional DTD 传统/过渡型 兼容最新的标准和就的标准
　　　　Frameset DTD 框架型
　　　　选择问题：从头写 用严格型；在别人的基础上维护 过渡型　　　
　　html页面：
　　　　文档头部：<head></head> 定义和整个文档相关的信息
　　　　<title>标题<title>
　　　　<meta charset=utf-8 />--定义网页基本信息--元数据 常用属性：content/http-equiv
　　　　<meta http-requiv="refresh" comtent="10" />刷新页面
　　文档主体：<body></body> 定义文档显示的内容
　　整个文档：<html></html> 定义文档的范围
　　注 释：<!--文档注释-->

5、<body>元素：
　　<1>文本标记
　　作用：文本是网页上的基本成分
　　直接书写的文本会用浏览器默认的样式显示
　　包含在标记中的文本则会被显示为标记所拥有的样式
　　分类：
　　特殊字符：&nbsp;
　　注 释：<!-- 内容-->
　　标题元素：<h1></h1>...
　　段落元素：<p></p>元素前后会有间距 元素内容独占一行
　　换行元素：<br > 单标签一般不需要添加内容 所以也就只有一个标签 间距比段落小
　　分区元素：需要进行统一设置时使用
　　　　　　<span></span>单行设置，格式没有变化不会影响布局 <div>会独占一行，块元素，用于多行设置
　　　　　　块元素(block)和行内元素（inline）：块--独占一行的元素，前后会自动换行 div/p/h1-h6
　　　　　　行内元素--和其他元素位于一行 如 ：span/a
　　注：空格折叠：html默认多个空格或制表符压缩成单个空格即显示为一个空格
　　　　特殊字符可以用转义字符，也称字符实体

　　<2>图像和链接
　　　　　　img:引入图像 单标签<img src="资源路径" />
　　　　写法：

　　　　　　<img src="d:/a.jpg">--绝对路径 在web里面是行不通的 不推荐
　　　　　　<img src="a.jpg">--相对路径 当前文件夹下（同一目录）在当前站点下找资源
　　　　　　<img src="http://tts.tarena.com.con/a.jpg">url路径 去其他地方找资源
　　　　　　注：图片显示的大小默认和原来一样，一般在引入时会设置width或height 不清楚比例时 就写一个 因为原图会等比例缩小/放大
　　　　超链接：点击去往其他资源/页面
　　　　　　　　<a href="url">被单击的内容：文字/图片<a /> href 是引用的意思
　　　　　　　　写法：<a href="a.html"><a />去当前路径的去找a.html的文件
　　　　　　　　<a href="http://tts6.tarena.com.con/ target="blank"></a> 引用一个网页
　　　　　　　　target默认值_self：替换当前 _blank:在新窗口打开
　　　　　　　　实际应用中可以图片链接:img嵌套a标签
　　　　锚点：当前页面不同位置的跳转
　　　　　　　　第一步 定点：在目标位置定义一个锚点 如<a name="link1"></a>是一个隐藏标记 不显示
　　　　　　　　第二步 链接：使用链接href指向link1 <a href="#link1">to link1</a> #是告知浏览器这不是页面而是锚点
　　　　　　　　注：锚点是针对有滚动效果的页面 才会有效果 内容较少时 看不出效果 理解上 这样的跳转无意义
　　　　　　　　　　有目录结构使用的较多
　　特殊用法：直接回到页面顶端的情况使用比较多，经常使用，因此有一种简化的写法：<a href="#">text</a>--返回界面顶端 相当于刷新的效果

　　<3>列表
　　　　什么是列表？将具有相似或先后顺序的几项文字进行对齐排列
　　　　特点：所有的列表都由列表类型和列表项组成
　　　　列表类型：有序列表--<ol>和无序列表<ul> ol指ordered list 排完序的列表 ol和ul只代表列表的开始和结束
　　　　列表项： <li>用于指示具体列表内容
　　　　嵌套列表：实际应用中最多 嵌套是嵌套在<li>标签当中
　　　　　　<ul>
　　　　　　　　<li>书籍
　　　　　　　　　　<ul>
　　　　　　　　　　　　<li>童话</li>
　　　　　　　　　　　　<li>诗歌</li>
　　　　　　　　　　　　<li>散文</li>
　　　　　　　　　　</ul>
　　　　　　　　</li>
　　　　　　　　<li>家电</li>
　　　　　　　　<li>电子</li>
　　　　　</ul>

　　<4>表格
　　　　a、作用：显示网格数据和页面布局
　　　　　　如：在表单注册时冒号对齐，使用表格的align右对齐
　　　　b、创建表格：表格的基本结构--table/tr(table row)/td(table defination)
　　　　　　注：表格的高宽默认自适应 如果设置了宽高，宽高会按原有比例进行分配
　　　　　　对列设置宽--影响整列，对列设置高--影响整行
　　　　　　对齐方式：默认水平居左--align(水平对齐属性)，垂直居中--valign(垂直对齐属性)
　　　　c、常用属性：
　　　　　表格的属性：border(外边框)/width/height/align/cellpadding(内容与边框--内边距)/cellspacing(单元格与单元格的间距--外边距)
　　　　　单元格的属性：width/height/align/valign
　　　　　标题：位于<table>元素中 <caption> 并且是第一个子元素
　　　　d、分组：如果用div就破坏了表格的结构所以不能用
　　　　　行分组，只能包含tr元素：
　　　　　thead 只能出现一次
　　　　　tbody 可以出现多次
　　　　　tfoot 只能出现一次
　　　　e、不规则表格：单元格的合并/拆分--实现跨行/跨列
　　　　　　表格无法同时既跨行又跨列。
　　　　　　对于td元素而言，有colspan,rowspan属性设置单元格跨行/跨列
　　　　　　colspan:单元格跨列--横着长
　　　　　　rowspan:单元格跨行--竖着长
　　　　f、表格的嵌套：<table>元素嵌套在<td>里 嵌套不能破坏原有表格的结构 和列表嵌套一类似

web基础笔记整理(一)的更多相关文章

  1. 知了课堂 Python Flask零基础 笔记整理

    目录 起步 安装Python2.7: Python虚拟环境介绍与安装: pip安装flask: 认识url: URL详解 web服务器和应用服务器以及web应用框架: Flask 第一个flask程序 ...

  2. HTML基础笔记整理

    「学习笔记」HTML基础 前言 勤做笔记不仅可以让自己学的扎实,更重要的是可以让自己少走弯路.有人说:"再次翻开笔记是什么感觉",我的回答是:"初恋般的感觉". ...

  3. web前端笔记整理，从入门到上天，周周更新

    由于大前端知识点太多,所以一一做了分类整理,详情可见本人博客 http://www.cnblogs.com/luxiaoyao/ 一.HTML 1.注释 格式:<!-- 注释内容 --> ...

  4. web基础笔记

    浏览器渲染页面的过程 浏览器渲染页面前需要先构建 DOM 和 CSSOM 树.因此,我们需要确保尽快将 HTML 和 CSS 都提供给浏览器. 参考:https://developers.google ...

  5. Web前端笔记整理

    不使用Ajax无刷新提交: header('HTTP/1.1 204 No Content'); var a=document.createElement('img'); a.setAttribute ...

  6. web前端笔记整理一---HTML

    一 HTML标签1 页面及标记 1 HTML 文件结构 拓展名 .html或者.htm <!DOCTYPE html>// 声明 <html> html 主体 <head ...

  7. web前端笔记整理---CSS

    一   Css  文件 Css: 美化HTML的 4种选择器: 元素选择 类选择 ID选择 伪类选择 常用的布局方案 1 写在什么位置能好用. 1.1 元素里面 优先级是最高的 1.2 元素外,文件内 ...

  8. java概念基础笔记整理

    1.构造方法没有类型,有类型的不是不叫构造方法. 2.一个类的的成员变量可以是java允许的任何数据类型,一个类可以把某个对象作为自己的一个成员变量,如果用这样的类创建对象,那么该对象中就会其他对象, ...

  9. Git 基础笔记整理1

    Git 官网:http://git-scm.com/ git教程1:http://www.yiibai.com/git/home.html git教程2 :http://www.liaoxuefeng ...

随机推荐

  1. js 图片转换为base64

    <input id="file" type="file"> <img id="img" style="max-h ...

  2. Hue 之 SparkSql interpreters的配置及使用

    1.环境说明: HDP 2.4 V3 sandbox hue 4.0.0 2.hue 4.0.0 编译及安装 地址:https://github.com/cloudera/hue/releases/t ...

  3. Flash真的老了，HTML5将取代其地位

    简单讲一些网页开发的趋势吧! Flash老了 Flash是一个落后于时代的技术,靠对客户端的高资源占用率来获取传输过程的低带宽占用. Flash不再安全 Flash是一个落后于时代的技术,靠对客户端的 ...

  4. 十一、VueJs 填坑日记之使用Amaze ui调整列表和内容页面

    上一篇博文我们整合了Amaze ui,并且调整了一个头部header和底部footer文件,其实做起来也很简单,只要按照步骤来做,完全没有问题.今天我们来重新调整一下列表页面和内容页面,使我们做的后台 ...

  5. PHP使用api的两种方法

    1.用file_get_contents()函数 $params = array('key' => '8d284859d04cfeeea6b0771f754adb49', 'location' ...

  6. margin、padding单位百分比

    年前做了一个测试题 https://www.wenjuan.com/s/VjaEva/,里面有一道题目涉及到了margin和padding单位为百分比的情况.写出来记录一下以防止自己忘记. <! ...

  7. MySQL .msi 安装失败改用.zip安装步骤

    一开始官网下载.msi安装包,安装到配置server时无法启动,长时间卡在这里,无法继续下去.上网看了一下解决办法,发现用.zip安装包进行安装比较简单可靠. 一.利用.msi安装包安装失败后的处理 ...

  8. 在O（n）时间复杂度内找到出现超过一半的数

    #include<iostream> using namespace std; bool solver(const int a[],const int n, int & num) ...

  9. 【原创】2、小程序域名配置之申请支持SSL（https）

    要把一个网站对接进小程序,一.网站的域名必须通过备案(ICP备案).在买域名的时候,各个域名服务商都有提供相应的备案平台,可以方便的提交备案.工信部官网:http://www.miitbeian.go ...

  10. 使用echarts，制作色温图

    1.需要下载echarts的echarts-all.js文件和创建地图需要用到的数据源 2.在项目中创建jsp文件,将js文件引入 <script type="text/javascr ...