一个互联网公司的分工，小公司要求全能，拿一个项目全部做出来。大公司分工明细，主要步奏为策划人员策划方案，美工人员设计图有.psd.rp等，前端人员做静态页面，后台人员获取数据java php .net。无论是处于那块的人员，都要对于其他的有所了解。

www网页服务，FTP文件上传下载，telnet远程控制

Apache2.2服务器

windows+r=运行，输入services.msc调出服务控制台

本地：127.0.0.1，访问自己本地服务器，需要使用Apache架起服务器之后，将文件放置到htdocs文件夹当中。安装Apache时要注意不能有中文文字不能有空格，可以直接安装到C盘下，不要安装到默认文件夹中。

主要使用的测试浏览器有IE、firefox、chrome、opera、safari

服务器端技术与客户端技术

常见的服务器端技术（运行在服务器上）：

JSP/PHP/ASPX

（前端）常见的客户端技术（运行在浏览器上）：

HTML/CSS/JS/SWF（flash）

计算机语言，HTML与JAVA/C/PHP不同，一门语言有三种结构，顺序执行、循环执行、选择执行。HTML里没有循环、选择等基本结构，只有纯文本和52个标签。

双标记标签：<标签名>文本</标签名>

单标记标签：<标签名/> 单标记标签中不能包含内容

<hr/>水平线<br/>换行

Meta标记的使用

<meta name=”keywords” content=”value”>多个关键字内容之间可以用“，”分割

设置描述：<meta name=”description” content=”value” >

设置作者：<meta name=”author” content=”作者名”>

设置字符集：<meta http-equiv=”content-type” content=”text/html;charset=gb2312”/>或者utf-8

gb2312主要用于中文文字较多的，而utf-8是国标，在国际上使用较多。

设置页面定时跳转：<meta http-equiv=”refresh” content=”2;URL=http://www.baidu.com”/>

html与xhtml的区别，xhtml首先所有字母都小写，其次所有标记都要有关闭。

格式：<标记 属性1=参数1 属性2=参数2>内容</标记>

不同标签具有不同的属性，所有标签都具备以下四个属性：

id：整个文档每个标签可以声明一个唯一的id号

style：为元素指定css样式

class：指定元素所属的类型

title:指定标签的弹出提示语

写代码前需要声明文档类型，否则会影响到css和javascript的解释执行，很多效果就会出不来。

文档类型声明：（所有工具都能生成这句话）

<!DOCTYPE html PUTLIC “-//W3C//DTD XHTML1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

windows+d可以将桌面调出来。

meta data:元数据-描述数据的数据（视频1day02视频1的35分）

<meta http-equiv=”content-type” content=”text/html;charset=UTF-8”/>元数据，写在head里面title上面比较好，这样会告诉浏览器以下的文字内容以这个标准来解析。避免出现乱码问题。

转义字符：

<>正常来说是无法显示的，会被认为是告诉浏览器的语言，所以需要使用转义字符来显示到前台。

基本格式：&xxxx

<     是&lt;

>     是&gt;

空格   是&nbsp;

&      是&amp;

©      是&copy;

™       是&trade;

®       是&reg；

XHTML中不使用描述样式，都是使用CSS来控制样式，而在html中描述样式和描述语义是混杂的。例如<b>和<strong>，前面是描述样式，后面是描述语义，在xhtml中<b>描述样式标签就不可存在了。xhtml中，<em>代替<i>。

如今新网页中大多都是用的xhtml，为什么html却没被废弃呢？因为之前很多老网页没有修改过，都还是用的描述样式的方式，所以无法废弃，只是新的不再使用。

html元素类型，共有100多个元素类型，差不多各占一半，有的只能用于区块元素中，有的只能用于内联元素中。如果区块元素的用于内联元素中，那么效果就不会显示出来。

  1. 区块元素(block)，必须自己独立占一行，例如<div></div>
  2. 内联元素(inline)，自己有多宽就占多宽，同时也与其他的处于同一行中。

内联标签：<b><strong><i><em><u><s><sub><sup><span><img/><a><input type=”text”/><input type=”submit”/><label><select><textarea>

区块标签：<h1>到<h6><div><p><hr><pre><table><ul><li><ol><dl><dt><dd><form>

描述标签：<b><i><sub><sup><width><color><align>

语义标签：<p><strong><em><h1>到<h6>

分区元素用于为元素分组，常用与页面布局。<span>和<div>

块分区元素<div></div>，元素分组工具，用于内容分层和页面布局，需配合CSS使用

行内分区元素<span></span>需配合css和Js才有效果

下标字：<sub></sub>

上标字：<sup></sup>

ctrl+d删除一整行

ctrl+alt+↓复制一整行

标题字在不同的浏览器默认字体高度、间距都是不一样，所以会存在兼容性的问题。要使用css来屏蔽这个问题。

<b/>,在html或者html5中“/”可以省略，但是在xhmtl中是不可以省略的。

<hr>分隔线元素，创建一条水平线，常用属性为（size、width、align、color）

<img/>通知浏览器此刻应该向服务器发起一个图片请求，src指定图片的URL,alt属性，如果图片无法显示则显示此文字来替代。

html页面中可能用到资源：图片、css、js、另一个页面

web开发用到的图片格式

bmp:未经压缩的bit图，一般不用于web开发

psd：ps的原始文档，支持层，页面中不直接使用

tiff：出版印刷

raw：太大

jpeg：经过压缩的图片，保真度高，色彩丰富，适用于web中的照片，1024*768大压缩到100k甚至更小完全可以接受

png：色彩没有jpg丰富，但是透明度支持的好，压缩比例大，适合于图标

gif：色彩比较丰富，支持动画效果，也在一定程度支持透明度。

链接的表现形式

  1. 目标文档为下载资源<a href=”DAY02.zip”>下载</a>
  2. 电子邮件链接<a href=”mailto:balabala@163.com”>联系我们</a>
  3. 返回页面顶部的空链接<a href=”#”>…</a>
  4. 链接到javascript<a href=”javascript:…”>js功能</a>

页面布局的三种方式：

table的使用主要用于显示批量的数据，但是作为页面布局已经过时。

div+css现在的主流

html5布局标签，未来的趋势

蓝色的是内容所占区域，橙色的是间距，绿色的是填充。

form表单，用于收集用户的数据，提交给服务器。有两个属性，action是指定表单数据的处理页面，必须是动态页面。还有input type。

地址栏url中最多输入字符不能超过1024个字节。

2015年10月15日学习html基础笔记的更多相关文章

  1. 2016年10月15日 星期六 --出埃及记 Exodus 18:26

    2016年10月15日 星期六 --出埃及记 Exodus 18:26 They served as judges for the people at all times. The difficult ...

  2. 【C++】命令行Hangman #2015年12月15日 00:20:27

    增加了可以在构造Hangman对象时通过传入参数设定“最大猜测次数”的功能.少量修改.# 2015年12月15日 00:20:22 https://github.com/shalliestera/ha ...

  3. 10月15日 | 云栖大会“淘宝移动技术实践&开放论坛”来了！

    参会报名链接:http://baichuan.taobao.com/marketing/yunqi#?baichuan_channel=cnblogs 顺应移动互联网消费升级趋势, 淘宝作为移动领域的 ...

  4. 2015年10月22日CSS学习笔记

    XHTML1.0对HTML4.0的改进 借鉴了XML的写法,语法更加严格. 把页面的内容和样式分离了,废弃了html4中的表示样式的标签和属性.推荐使用css来描述页面的样式. CSS样式的优先级 ! ...

  5. 十大Intellij IDEA快捷键（转）（2015年06月15日）

    注:本文转自:http://blog.csdn.net/dc_726/article/details/42784275 Intellij IDEA中有很多快捷键让人爱不释手,stackoverflow ...

  6. 2016 10月15日java的动手动脑

    (1) 编写一个方法,使用以上算法生成指定数目(比如1000个)的随机整数. 源程序: //随机数的产生 //zhanxinwu,October,15,2016 public class Recur ...

  7. c# Equal函数 and 运算符'==' （原发布 csdn 2017年10月15日 20:39:26）

    1.==.!=.<.>.<= 和>= 运算符为比较运算符(comparison operator).C#语言规范5.0中文版中比较运算符的描述如下: 2.通用类型系统 3.值类 ...

  8. 2015年10月23日JS笔记

    ECMAScript标准:JavaScript核心语法 微软:Jscript ECMAScript标准:一纸空文 JavaScript和JScritp都号称完全实现了 ECMAScript标准 W3C ...

  9. 7月15日学习之BOM

    setTimeout() //延时器,只执行一次代码 clearTimeout() //清除演示器 setIntervla() //定时器,根据指定时间间隔执行一次代码 clearInterval() ...

随机推荐

  1. DataNavigator之分页

    前言 做客户端也有两个月了,先前做列表都没有分页,可能考虑数据也不是很多,昨天做了一个页面,考虑到了数据的问题,所以改为分页查询.因为也是第一次用dev,用哪个控件分页呢,还是要去搜一下,得出的事Da ...

  2. 【6】了解Bootstrap栅格系统基础案例（1）

    从上一张我们了解了栅格选项,那么我们就来了实战了解下吧(其实还是中文官网的案例) ps.我这里是电脑上用谷歌浏览器来观察的,毕竟电脑的分辨率高(1440*900px),谷歌浏览器最大化后,值比大屏幕设 ...

  3. javascript进阶——分离式DOM脚本编程

    编写分离式(unobstrusive)代码意味着对HTML内容的完全分离:数据来自服务器端,javascript代码用来动态化和交互.这种分离的好处是在不同浏览器之间使用是可以完全降级或升级运行,对于 ...

  4. phpcms前端页面上传文件

    PHPCMS其实有一个叫做附件的模块,上传用的就是这个东西,现在我们来看一下对应的文件:phpcms\modules\attachment \attachments.php就是这个文件,大概在29行上 ...

  5. 安装IntelliJ IDEA热部署tomcat插件JreBel

    最近试着使用IntelliJ IDEA这款IDE,网上说它是最好用的java开发工具~但奈何国内ecilpse市场占有率实在稳固,所以国内这个工具也就少数人在使用 当然使用起来跟ecilpse还是有很 ...

  6. 微信获取用户的openid和详细信息

    获取用户的信息的原理,首先用户会点击一个url,这个url会包含一个参数redirect_uri,这个url是指向微信那边的服务器的,然后微信会把这个http请求重定向到redirect_uri,即我 ...

  7. 用Cocos2d-x实现2D光线效果

    2015.3.23优化修改,现在已经能达到稳定60帧了.. 本博客地址:http://www.cnblogs.com/wolfred7464/ 创意来自于:http://ncase.me/sight- ...

  8. js中的字典

    最近项目JS中需要建一个特殊的颜色库,需要用到类似C#中的dictionary的概念 然后一查发现JS没有dictionary 而是Array 初始化Array colorDic = new Arra ...

  9. UIWebView 加载网页、文件、 html-b

    UIWebView  是用来加载加载网页数据的一个框.UIWebView可以用来加载pdf word doc 等等文件 生成webview 有两种方法,1.通过storyboard 拖拽 2.通过al ...

  10. 贝塞尔曲线算法，js贝塞尔曲线路径点

    //anchorpoints:贝塞尔基点 //pointsAmount:生成的点数 //return 路径点的Array function CreateBezierPoints(anchorpoint ...