初学前端开发，记录下自己的学习笔记。

第一章 认识HTML

1:关于HTML

　　HTML是超文本标记语言（HyperText Markup Language）的缩写，用来建立网页的结构。

　　它只会根据标记来确定在哪里换行或者分段。所以浏览器会忽略HTML文档中的制表符、回车和空格。

　　共有六级标题，从<h1>到<h6>，字体由大到小。

　　HTML注释放在<!--和-->之间，浏览器会把它们完全忽略，可以有多行。

　　<em>元素表示强调。

　　<head>的HTML页面的头部，它包含了web页面的相关信息。

2、关于CSS

　　CSS是层叠样式表（cascading style sheets）的缩写。它提供了一种方法来告诉浏览器页面中的元素如何显示。

　　想要增加样式，要在页面中增加<style>元素。它放在HTML的首部里。

　　它有一个可选的属性type，告诉浏览器在使用什么类型的样式。使用CSS，对应的类型是"text/css"。

第二章 深入了解超文本

<a>元素创建一个超文本链接，元素的内容会成为web页面上可以点击的文本，href属性会告诉流浪器链接目标。

文本和图像都可以当做链接的标签。

第三章 构建模块

<q> 短引用：作为现有段落的一部分，大部分浏览器会加上引号，是quotation的缩写。

<blockquote> 长引用 ： 这是一个块元素，创建了一个单独的文本块，还会将文字稍微缩进，看起来更像一个引用。若果想引用一段或者多段文字，可以使用这个元素。

在<blockquote>中使用<q>这是引用的引用，使用<p>的话可以形成多个段落。

　

　 块(block)元素,前后都有一个换行, 如<h1> ~ <h6>, <p> , <blockquote>,<ol>,<ul>,<li>等，特点是: 特立独行

内联(inline)元素,总在“行内”出现, 如<q>, <a>, <em>,特点是: 随波逐流

void元素,这个元素没有实际内容，会用简写来表示，如<img>, <br>,这样能提高效率。

如果想插入自己的换行是，使用<br>元素。

<ol> order list 有序列表

<ul> unorder list 无序列表

<li> list item

　字符实体：如果想输出 The <html> element，通过使用字符实体 可以这样写  The &lt; html &gt; element ，更多的字符实体可以访问http://www.unicode.org/charts/

第四章 连接起来

　　www.starbuzzcoffee.com 中 starbuzzcoffee.com 是域名， www是域中特定服务器的名字。

www.starbuzzcoffee.com只是 starbuzzcoffee.com这个域上的一个网站。

　　URL(Uniform Resource Locateor)统一资源定位符，是一个全局地址，可以定位web上任意资源，包括html页面，音频，视频以及其他形式的web内容。

　 web服务器默认文件名为"index.html"或"default.htm",所以如果浏览器请求目录，服务器会在该目录下寻找"index.html"或"default.htm"，如果找到则返回。如果末尾没有正斜杠，如果该目录确实存在，那么浏览器会自动帮你加上末尾的斜线。

　　文件URL有3个斜线而不是2个，http url中删去网站名也会有3个斜线

　　web服务器默认端口为80

　　

　　<a href="index.html#chai">See Chai Tea</a>或者href = "http://wickedlysmart.com/buzz/#Teas_and_other_infusions,点击这个链接就会跳转到index.html中id为chai或者Teas_and_other_infusions的部分显示，否则默认是链接到top位置。

<a target="_target" href="http://www.google.com">Google</a>  在一个新的窗口打开这个链接

第五章 为页面增加图像

　　照片和复杂图像使用 jpeg（jpeg有损、不支持透明度、比较小、不支持动画）

　　单色图像、logo和几何图像使用png或gif（png可包含上百万中颜色、无损、可透明、图像下面的东西可以显示出来、相对于jpeg而言png更大；Gif类似png、256种颜色、无损、支持透明度，不过只允许一种颜色设置为透明、比jpeg更大、支持动画）

第六章 标准及其他


使用W3C严重工具来验证：http://validator.w3.org

 

 

Head First Html and CSS学习笔记之HTML的更多相关文章

  1. CSS学习笔记

    CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...

  2. HTML+CSS学习笔记 (7) - CSS样式基本知识

    HTML+CSS学习笔记 (7) - CSS样式基本知识 内联式css样式,直接写在现有的HTML标签中 CSS样式可以写在哪些地方呢?从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌 ...

  3. HTML+CSS学习笔记 (6) - 开始学习CSS

    HTML+CSS学习笔记 (6) - 开始学习CSS 认识CSS样式 CSS全称为"层叠样式表 (Cascading Style Sheets)",它主要是用于定义HTML内容在浏 ...

  4. HTML+CSS学习笔记（5）- 与浏览者交互，表单标签

    HTML+CSS学习笔记(5)- 与浏览者交互,表单标签 1.使用表单标签,与用户交互 网站怎样与用户进行交互?答案是使用HTML表单(form).表单是可以把浏览者输入的数据传送到服务器端,这样服务 ...

  5. HTML+CSS学习笔记(4) - 认识标签（3）

    HTML+CSS学习笔记(4) - 认识标签(3) 1.使用<a>标签,链接到另一个页面 使用<a>标签可实现超链接,它在网页制作中可以说是无处不在,只要有链接的地方,就会有这 ...

  6. HTML+CSS学习笔记（3）- 认识标签（2）

    HTML+CSS学习笔记(3)- 认识标签(2) 1.使用ul,添加新闻信息列表 在浏览网页时,你会发现网页上有很多信息的列表,如新闻列表.图片列表, 这些列表就可以使用ul-li标签来完成.ul-l ...

  7. HTML+CSS学习笔记(2) - 认识标签（1）

    HTML+CSS学习笔记(2) - 认识标签(1) 1.语义化,让你的网页更好的被搜索引擎理解 标签的用途: 我们学习网页制作时,常常会听到一个词,语义化.那么什么叫做语义化呢,说的通俗点就是:明白每 ...

  8. HTML+CSS学习笔记(1) - Html介绍

    HTML+CSS学习笔记(1) - Html介绍 1.代码初体验,制作我的第一个网页 <!DOCTYPE HTML> <html> <head> <meta ...

  9. css学习笔记四

    广州天气变冷了,css学习笔记还是要总结. 总结: 1:几米页面静态页面主要是一列结构头部banner图,mainbody部分放文字内容和图书图片,底部是页面的版权信息 2:腾讯软件中心静态页面制作( ...

  10. CSS学习笔记：溢出文本省略（text-overflow）

    原文:CSS学习笔记:溢出文本省略(text-overflow) 在CSS3中,text-overflow属性的基本语法如下: clip:表示不显示省略文本,简单的裁切. ellipsis:表示对象文 ...

随机推荐

  1. codeforces 645 E. Intellectual Inquiry

    一个字符串,由前k个字母组成,长度为m + n,其中前m个字符已经确定,后面n个由你自由选择, 使得这个串的不同的子序列的个数最多,空串也算一个子序列. 1 <= m <= 10^6,0 ...

  2. 功能强大的web打印控件lodop的使用

    打印是很多web系统都需要的功能,最近找到一款功能强大,使用简单,价格便宜的web打印工具Lodop,免费也能用,不过有水印,也不贵商业开发建议购买. 废话不多说,拿来就用,从简单的打印开始. 1.下 ...

  3. git bash下对文件的操作

    window下的e盘中webpack文件夹操作 新建文件夹:mkdir wpdemo: 新建文件:touch index.html; 删除文件夹:rm -r wpdemo; 删除文件:rm index ...

  4. CRM 2016 子表单中N:1关系 字段要求与新建时的关系

    父表单在新建子表单项时弹出的窗口和 子表单的N:1关系是有关系的.说白了就是子表单窗体上的父表单字段是不是必填项. 关系如下: 1 非必填项 点击子表单的"+"号时,会出现look ...

  5. 【原】redis插件安装

    wget -c https://github.com/nicolasff/phpredis/archive/2.2.4.tar.gz -O phpredis-2.2.4.tar.gz tar xzf ...

  6. SplendidCRM中给来自EditView中的listbox控件设置选中值或数据源

    DropDownList list = this.findContol("aas") as DropDownList;list.DataSource = new DataTable ...

  7. SQL语句Where中使用别名作为判断条件

    当我们使用某个表达式作为输出的一列时,我们无法再Where条件中直接使用该列作判断条件.   例如下面的SQL语句: select id, (c1 + c2) as s from t1  where ...

  8. samba服务器搭建小记

    经常要在局域网的linux和windows主机之间共享文件,我遇到了当年samba作者同样的问题,既然人家已经写好了这个软件那就直接拿来用吧. 首先,在linux主机上执行 sudo apt-get ...

  9. Tableau 地图无法识别怎么办

    Tableau地图是一个很优秀的工具,可以选择城市或者省份作为单位来显示地图. 前几天做了一个省份的感觉很好,今天用城市做单位居然有些城市识别不了,其中包括贵阳和宿迁.   换了拼音之后贵阳能够识别了 ...

  10. （转载）afxres找不到问题

    在试用VS2010时一个问题困扰了我,就是打开c++项目后,rc的dialog进不去,没法拖控件,把我给抓狂的...而且网上大部分说的都是Directions的问题..我的问题明显不是这个问题. 于是 ...