一、Web让广播明星黯然失色

　　　　要建立Web页面，需要创建用超文本标记语言（HyperText Markup Language，HTML）编写的文件，把它们放在一个Web服务器上

二、Web服务器能做什么？

　　Web服务器在互联网上有一份全天候的工作。

　　 服务器就是连接到互联网的计算机。

　　每个服务器会存储HTML文件、图像、声音和其他类型的文件。

　　 你在网上冲浪，单击一个链接来访问某个页面。这个单击会导致浏览器向Web服务器请求一个HTML页面

三、你写的代码（HTML）

<html>

    <head>

        <title>Head First Lounge</title>

    </head>

    <body>

        <h1>Welcome to the Head First Lounge</h1>

        <img src="I:\sss\image\coffee_cup.jpg">

        <p>

            Join us any evening for refreshing elixirs,

            conversation and maybe a game or

            two of <em> Dance Dance Revolution </em>.

            Wireless access is always provided;

            BYOWS(Bring your own Web server).

        </p>

        <h2>Directions</h2>

        <p>

            You'll find us right in the center of

            downtown Webville.Come join us!

        </p>

    </body>

</html>

四、浏览器创建的页面

　　标记就是尖括号括起来的词或字符，它会告诉浏览器文本的结构和含义。

五、你在Starbuzz咖啡馆交好运了

六、创建Starbuzz Web页面

　　

 <html>

     <head>

         <title>index</title>

     </head>

     <body>

         <p>

         House Blend,$1.49

         A smooth,mild blend of coffees from

         Mexico,Bolivia and Guatemala.

         Mocha cafe Latte,$2.25

         Espresso,steamed milk and chocolate

         syrup.

         Cappuccino,$1.89

         A mixture of espresso,steamed milk

         and foam.

         Chai Tea,$1.85

         A spicy dring made with black tea,

         spices,milk and honey

         </p>

     </body>

 </html>

七、创建一个HTML文件

八、现在，再回到Starbuzz

九、保存你的成果

　　创建一个项目文件夹：能描述项目的功能，比如starbuzz

十、在浏览器中打开你的Web页面

十一、测试你的页面

　　现在来增加结构：

<html>

    <head>

        <title>index</title>

    </head>

    <body>

        <h1>Starbuzz Coffee Beverages</h1>

        <h2>House Blend,$1.49</h2>

        <p>A smooth,mild blend of coffees from

        Mexico,Bolivia and Guatemala.</p>

        <h2>Mocha cafe Latte,$2.25</h2>

        <p>Espresso,steamed milk and chocolate

        syrup.</p>

        <h2>Cappuccino,$1.89</h2>

        <p>A mixture of espresso,steamed milk

        and foam.</p>

        <h2>Chai Tea,$1.85</h2>

        <p>A spicy dring made with black tea,

        spices,milk and honey</p>

    </body>

</html>

十二、完工了吗？

　　编写HTML时要把首部和页面主体分开

十三、另一个测试

十四、标记剖析

　　元素=开始标记+内容+结束标记

十五、认识style元素

　　CSS是层叠样式表（Cascading Style Sheet）

　　<style>标记有一个（可选的属性），名为type，它能告诉浏览器你在使用什么类型的样式。

　　元素可以有属性？这是什么意思？————通过属性，可以提供一个元素的附加信息。比如说，如果有一个<style>元素，属性允许你准确地指出是什么类型的样式。以后还会看到不同元素的更多属性：你只要记住一点，属性能提供元素的一些额外信息。

　　为什么必须指出样式类型（"text/css"）作为style元素的一个属性？难道还有其他类型的样式吗？————从前，HTML的设计者认为以后应该还会有其他样式，不过如今，呵呵。。。

十六、给Starbuzz网站加点样式......

body{

    background-color:#d2b48c;

    margin-left:20%;

    margin-right:20%;#设置右边距占页面的20%

    border:2px dotted black;#定义页面主体周围的边框是虚线，黑色

    padding:10px 10px 10px 10px#在页面主体周围创建一些内边距

    font-family:sans-serif;

}

十七、测试样式

《HTML与CSS 第一章 认识HTML》读书笔记的更多相关文章

  1. csapp读书笔记-并发编程

    这是基础,理解不能有偏差 如果线程/进程的逻辑控制流在时间上重叠,那么就是并发的.我们可以将并发看成是一种os内核用来运行多个应用程序的实例,但是并发不仅在内核,在应用程序中的角色也很重要. 在应用级 ...

  2. CSAPP 读书笔记 - 2.31练习题

    根据等式(2-14) 假如w = 4 数值范围在-8 ~ 7之间 2^w = 16 x = 5, y = 4的情况下面 x + y = 9 >=2 ^(w-1)  属于第一种情况 sum = x ...

  3. CSAPP读书笔记--第八章 异常控制流

    第八章 异常控制流 2017-11-14 概述 控制转移序列叫做控制流.目前为止,我们学过两种改变控制流的方式: 1)跳转和分支: 2)调用和返回. 但是上面的方法只能控制程序本身,发生以下系统状态的 ...

  4. CSAPP 并发编程读书笔记

    CSAPP 并发编程笔记 并发和并行 并发:Concurrency,只要时间上重叠就算并发,可以是单处理器交替处理 并行:Parallel,属于并发的一种特殊情况(真子集),多核/多 CPU 同时处理 ...

  5. 读书笔记汇总 - SQL必知必会（第4版）

    本系列记录并分享学习SQL的过程,主要内容为SQL的基础概念及练习过程. 书目信息 中文名:<SQL必知必会(第4版)> 英文名:<Sams Teach Yourself SQL i ...

  6. 读书笔记--SQL必知必会18--视图

    读书笔记--SQL必知必会18--视图 18.1 视图 视图是虚拟的表,只包含使用时动态检索数据的查询. 也就是说作为视图,它不包含任何列和数据,包含的是一个查询. 18.1.1 为什么使用视图 重用 ...

  7. 《C#本质论》读书笔记（18）多线程处理

    .NET Framework 4.0 看(本质论第3版) .NET Framework 4.5 看(本质论第4版) .NET 4.0为多线程引入了两组新API:TPL(Task Parallel Li ...

  8. C#温故知新：《C#图解教程》读书笔记系列

    一.此书到底何方神圣? 本书是广受赞誉C#图解教程的最新版本.作者在本书中创造了一种全新的可视化叙述方式,以图文并茂的形式.朴实简洁的文字,并辅之以大量表格和代码示例,全面.直观地阐述了C#语言的各种 ...

  9. C#刨根究底：《你必须知道的.NET》读书笔记系列

    一.此书到底何方神圣? <你必须知道的.NET>来自于微软MVP—王涛(网名:AnyTao,博客园大牛之一,其博客地址为:http://anytao.cnblogs.com/)的最新技术心 ...

  10. Web高级征程：《大型网站技术架构》读书笔记系列

    一.此书到底何方神圣? <大型网站技术架构:核心原理与案例分析>通过梳理大型网站技术发展历程,剖析大型网站技术架构模式,深入讲述大型互联网架构设计的核心原理,并通过一组典型网站技术架构设计 ...

随机推荐

  1. Python记录4：文件操作

    ###文件 ''' 1. 什麽是文件     文件是操作系統為用戶/应用程序提供一種操作硬盤的虚拟单位 2. 爲何要用文件     为了存取硬盘数据 3. 如何用文件 #1. 打開文件 #2. 读写文 ...

  2. shader之法线变换

    对于法线变换,进行非统一缩放时,如果使用跟变换顶点相同的变换矩阵来变换法线,则会得到错误的结果,即变换后的法线方向与平面不再垂直. 如何求得变换法线的矩阵呢: 转载请注明出处:http://www.c ...

  3. 32网络通信之Poll模型

    多路复用并发模型  -- poll #include<poll.h> int  poll(struct pollfd *fds,  unsigned int nfds, int timeo ...

  4. copy on write，代理模式

    StringBuilder 内部用了代理的技术实现, 是可变字符串的代理 .net设计模式实例之代理模式(Proxy Pattern) 一.代理模式简介(Brief Introduction) 代理模 ...

  5. 【Alpha版本】冲刺阶段——Day1

    [Alpha版本]冲刺阶段--Day1 阅读目录 Alpha 阶段成员分工及任务量 团队成员贡献值的计算规则 明日任务 今日贡献量 站立式会议 TODOlist [Alpha 阶段成员分工及任务量] ...

  6. 重复打印相同内容(Doc档)的时候自动生成打印编号

    昨天突然接到一个好久未联系的朋友电话,说是江湖救急,要打印一份单据,单据上有个号码要自动生成,如下图,最土的办法是打印完一张,手工改下号码,但这种方法估计碰到成百上千张时估计会疯掉 网上找了实现方法, ...

  7. php 一个文件搞定支付宝支付，微信支付

    博客:https://me.csdn.net/jason19905 支付宝支付:https://github.com/dedemao/alipay 微信支付:https://github.com/de ...

  8. Django XSS攻击

    Django XSS攻击 XSS(cross-site scripting跨域脚本攻击)攻击是最常见的web攻击,其特点是“跨域”和“客户端执行”,XSS攻击分为三种: Reflected XSS(基 ...

  9. UI简述

    UI的全称是user interface,即是用户界面.UI设计是指对软件的人机交互,操作编辑,界面美观的整体设计,从简单的角度来说就是,UI是视觉上的东西,包括logo.软件.网页的按钮.网页导航, ...

  10. SQL语句的优化方法

    减少对数据库的查询次数 尽量使用相同的或非常类似的SQL语句进行查询 避免不带任何条件的SQL语句的执行 sql语句用大写 别名的使用(1.5倍)