HTML 5程序员之路:daily 01-02

HTML 5程序员之路:daily 01- 02

第一次做自己的每日分享

Internet在我的认知中

  • Internet就是把无数个相对独立的计算机和用户端联系起来,用另一种理解方式就像小山村通过发达的交通和外界进行物资和信息的交流。

  • Internet提供的主要服务

  • Telnet/Email/WWW/BBS/FTP等
    Telnet: 即远程登录服务,它虽然方便且简洁,但是它将用户的所有内容,包括用户名和密码都明文在互联网上传送,具有一定的安全隐患,许多服务器都会选择禁用。
    email:即电子邮件。
    bbs:通过在计算机上运行服务软件,允许用户使用终端程序通过Internet来进行连接,执行下载数据或程序、上传数据、阅读新闻、与其它用户交换消息等功能。
    Ftp: 即文件传输协议,在FTP的使用当中,用户经常遇到两个概念:"下载"(Download)和"上传"(Upload)。可生成下载链接,就是我们常说的“种子”。

  • 基本实现技术

    • 分组交互原理:信息在Internet上被分成许多小数据包进行传输,到达目的地后将数据包重组为信息
  • TCP/IP协议簇 Tcp/Ip是TCP/IP协议簇中主要的两个协议,还包括其他的许多协议。

Web与Internet

  • Web与Internet的关系

  • 我的理解是web就是山村或城市,而inernet就像是交通网络。网线就是其中无数的道路。

Web简介

又称做万维网或环球网,即WWW(World Wide Web)

万维网就是无数文档的集合,这些文档驻留在因特网的某个地方


Web是基于Internet的一个多媒体信息服务系统

基于浏览器/服务器模式

由Web服务器、浏览器(Browser)和通信协议三部分组成

通信协议采用的是HTTP协议,超文本传输协议(Hypertext Transfer Protocol)

什么是HTML

  • HTML(HyperText Markup Language):超文本标记语言,一种纯文本类型的语言

  • Hypertext 指超文本,超文本是用超链接的方法,将各种不同空间的文字信息组织在一起的网状文本。用任何文本输出工具都可以书写超文本。

  • Markup 即为标记

  • language 在这特指计算机语言

  • 使用带有尖括号的标记将网页中的内容逐一标识出来

  • 标记语言不仅仅是一种语言,就像许多语言一样,它需要一个运行时环境,使其有用。提供运行时环境的元素称为用户代理。

  • 用来设计网页的标记语言

  • 用该语言编写的文件,以.html或.htm为后缀

  • 由浏览器解释执行

标记语法

  • 分为:封闭型标记(也叫双标记);必须要有头和尾,头表示标记语法开始,尾表示语法的结束


  • 和非封闭标记(也叫单标记或空标记)不能包含内容


元素嵌套

  • 元素之间可以互相嵌套,形成更为复杂的语法

  • 在嵌套元素时需要注意标记的嵌套顺序

文档结构

·<!doctype html>· 文档类型声明 在开始写代码要先声明写使用的哪种语法规则,因为机器识别是单一死板的。
<html> 表明文档包含的元素,即文档头(head)和主体部分(body)。
<head>文档头,用于为页面定义全局信息,title/meta/script/style/link等
<body>文档主体部分,在这主要是网页展示给读者的信息,可以进行插入图片,超链接,视频等资源信息

<b></b>加粗      
<i></i>倾斜  
<u></u>下划线  
<s></s>删除线  
<sup></sup>上标  
<sub></sub>下标  

附下两段代码,代码都有注释。

    
    <!doctype html>
    <html lang="en">
     <head>
      <meta charset="UTF-8">
    
      <meta name="Author" content="冬天不爱洗头">
    
      <title>Document</title>
     </head>
     <!--
     bgcolor:设置背景颜色
     text:设置字体颜色 也可以用 style="color:..."改变字体颜色
     
     back:设置背景图片
     URL:统一资源定位符,指出某一资源在网络中的位置
     ../即回到上一级目录
     http://www.baidu.com/img/tu.png
     http://协议名
     www.baidu.com  域名
     img:目录
     tu.png 具体的文件
     绝对路径:一个具体的位置,让其文件都知道某个资源位置
     相对路径:文件相对于当前位置的路径
     
     -->
     <body bgcolor="gray" text="red" background="">
     
      <h1>9.28</h1>
      <!--img
      必须要有src属性
      img的宽和高只写一个,保证图片不失真
      ../,找到当前路径的上一级目录
      -->
    [站外图片上传中……(4)]<br/>
    <!--a标记
    href:为了告知当前标记要跳转的内容
    url/mail/zip文件/.jpg/.mp3/#test/#
    target:_blank/_self
    name:设置锚点
    --> 
     <a href="mailto:594344517@qq.com?subject=我要请王老师吃饭&cc=18770811800@163.com" target="_blank">联系我们</a>
     
     <a href="http://www.apple.com" target="_self">广告合作</a>
     <a href="资源.rar">相关下载</a>
     <a href="123.jpg">高清大图</a>
     <a href="#test2">诗和远方 </a>
     <p>&nbsp</p>
     <p>&nbsp</p>
     <p>&nbsp</p>
     <p>&nbsp</p>
     <p><a name="test"
     id="test2">山顶</a></p>
     <p>&nbsp</p>
     <p>&nbsp</p>
     <p>&nbsp</p>
     <p>&nbsp</p>
    <a href="#">返回顶部</a>
     <a></a>
     
     
     </body>
    </html>
    
        
    <!doctype html>
    <html lang="en">
     <head>
      <meta charset="UTF-8">
    
      <meta name="Author" content="冬天不爱洗头">
    
      <title>Document</title>
     </head>
     <body> 
     
     <!--多个空格和制表符智慧显示一个空格,回车不会产生换行效果-->
     <!--转义字符;&nbsp;是空格 的转义字符--> 
        <p>奥特曼 &nbsp;&nbsp;&nbsp;大战&nbsp;&nbsp;&nbsp;   小怪兽</P>
    
        <p>奥特曼大战小怪兽</p>
    
    
    
    <h1>HTML5 &lt;day 1&gt;</h1>
    
    
    <p>今天<b>天气不错</b>,<i>我</i>吃了<s>6.5</s>元的<u>早饭</u></p>
    
    <!--sub:below
    sup:up
      -->
    <p>z=x<sub>1</sub><sup>2</sup>+x<sub>2</sub><sup>3</sup></p>
    
    <!--标题标记只有六级-->
    <h1>Test</h1>
    <h2>Test</h2>
    <h3>Test</h3>
     <h4>Test</h4>
     <h5>Test</h5>
     <h6>Test</h6>
    <!--title对某一个标记进行描述-->
     <p align="center" id="" title="title标记">123456789</p>
    <!--宽度有两种表达方式
    1.绝对的;有固定长度,例如100px
    相对的:通过百分比来确定,例如50%
    -->
    
     <hr size="10" color="black" width="50%"  align="left"/>
    
     <!--
     <br/>是换行标记,是一个单标记
     nobr是不允许换行,双标记-->
     <p><nobr>今天在疯狂学东西,很是不错。解放路倒萨封疆大吏撒娇反对声浪飞机拉的发生的看法哈的发生sad房价ask萨 防守打法</nobr> </p>
    
     <div>今天天气不错一</div>
     <div>今天天气不错二</div>
     <h1>HTML 5 <span style="color:red;" >&lt;Day 1 &gt;</span></h1>
     <pre>
             生活不止
         眼前的苟且,
     还有诗和远方。</pre>
     </body>
    </html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,937评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,503评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,712评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,668评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,677评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,601评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,975评论 3 396
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,637评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,881评论 1 298
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,621评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,710评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,387评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,971评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,947评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,189评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,805评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,449评论 2 342

推荐阅读更多精彩内容