web基础笔记整理(一)

一、程序的分层
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>里 嵌套不能破坏原有表格的结构 和列表嵌套一类似

原文地址:https://www.cnblogs.com/startwalk/p/8150539.html

时间: 2024-11-24 10:07:11

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

ios基础 笔记整理 第一章 第一节

一:NSString与NSInteger的互换 NSInteger转化NSString类型:[NSString stringWithFormat: @"%d", NSInteger]; NSString转化 NSInteger类型:NSInteger = [NSString intValue]; *其它几个同理 [NSString boolValue].[NSString floatValue].[NSString doubleValue] 二:Objective-c中集合里面不能存放

网络基础笔记整理

什么是调制解调器? 调制解调器,连接网卡和网络运营商用的,叫moden,人们管它叫猫. 主要用于连接各运营商外网线路使用. 宽带接入方式:ADSL(升级版VDSL) 光钎,LAN 上网接入internet的方式主要分为:窄宽和带宽, 将网络接入速度为64Kbps及其以下的网络接入方式称为"窄带",相对于宽带而言窄带的缺点是接入速度慢 传输速率低,很多互联网应用无法在窄带环境下进行,如在线电影,网络游戏,高清晰的视频及语音聊天等. 拨号上网是最常见的一种窄带. 因特网和局域网的关系,窄宽

从0开始学Swift笔记整理(五)

这是跟在上一篇博文后续内容: --Core Foundation框架 Core Foundation框架是苹果公司提供一套概念来源于Foundation框架,编程接口面向C语言风格的API.虽然在Swift中调用这种C语言风格的API比较麻烦,但是在OS X和iOS开发过程中,有时候使用Core Foundation框架的API是非常方便的,例如在与C语言混合编码的时候. Core Foundation框架与Foundation框架紧密相关,他们具有与相同的接口,但是不同.Core Founda

web开发框架Django笔记整理

安装 python  setup.py  install 使用 1.创建工程 django-admin.py startproject Data_Collet_Center 2.运行开发server python manage.pyrunserver 0.0.0.0:8000 3.创建应用 python manage.py startapp DCC 4.配置 Data_collect_Center/settings.py 配置DB: 'ENGINE': 'django.db.backends.s

web服务的一些基础笔记

1. MIME(Multipurpose Internet Mail Extension,多用途互联网邮件扩展) 它是SMTP能够传输非文本格式文件的根源,将他引入到HTTP,那么HTTP也可以传输图片声音等非文本格式的文件,所以他也是HTTP可以传输非文本格式文件的根源. 将非文本数据在传输数据前重新编码为文本格式,接收方能够用相反的方式将其重新还原为原来的格式,还能够用相应的程序来打开. 2.flash,Applet(Java中), Flash也是一种变成语言.可以有动态网页. 3.动态网页

深度学习FPGA实现基础知识5(网友一致认可的----Deep Learning(深度学习)学习笔记整理及完整版下载)

需求说明:深度学习FPGA实现知识储备 来自:http://blog.csdn.net/zouxy09/article/details/8775360/ Deep Learning(深度学习)学习笔记整理系列 [email protected] http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0  2013-04-08   声明: 1)该Deep Learning的学习系列是整理自网上很大牛和机器学习专家所无私奉献的资料的.具体引用的资料请看参考文

【慕课网】php工程师学习计划之我的学习笔记——01 入门必学web基础 htmlcss基础课程 篇

为了进一步学习PHP,本周我选定了慕课网的PHP工程师学习计划, 从今天2015-07-06 10:24:47开始从头学习:计划本周尽快学习完成本课程,谨此作为笔记. 有个好的学习计划和思路非常非常重要,非常感谢慕课网提供本套学习计划,希望更多地学习平台能提供像这样全面一条龙学习思路清晰地教程. 计划图:链接 我的学习状况:2015-07-06 10:29:46 开始随记: php工程师学习计划笔记——01 入门必学web基础 htmlcss基础课程 篇 入门篇: text-align:cent

flask web开发笔记 -- 表单 --待整理

虽然Flask的请求对象给表单处理提供了足够的支持,但也有一些任务繁琐和重复.比如为表单生成HTML代码和验证提交表单数据. Flask-WTF扩展能解决上述问题.它基于wtforms 防止跨站请求伪造 跨站请求伪造(Cross-site request forgery),也被称为 one-click attack 或者 session riding,通常缩写为 CSRF 或者 XSRF, 是一种挟制用户在当前已登录的Web应用程序上执行非本意的操作的攻击方法.跟跨网站脚本(XSS)相比,XSS

Deep Learning(深度学习)学习笔记整理系列之(八)

Deep Learning(深度学习)学习笔记整理系列 [email protected] http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04-08 声明: 1)该Deep Learning的学习系列是整理自网上很大牛和机器学习专家所无私奉献的资料的.具体引用的资料请看参考文献.具体的版本声明也参考原文献. 2)本文仅供学术交流,非商用.所以每一部分具体的参考资料并没有详细对应.如果某部分不小心侵犯了大家的利益,还望海涵,并联系博主