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

第一章 认识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. vuejs,router

    接下来我们要做的是vue的路由处理,首先当然是安装: npm install vue-router 接下打开我们的main.js,引入我们vue-router,然后在告诉vue我们要使用我们的vue- ...

  2. Python创建cvs文件，包含标签和图片数据

     在深度学习或者机器学习的时候,常常需要对数据进行整理和分类,最常见的是通过对数据路径和标签写入 到一个整合的txt或者csv文件中,训练进行读取. #coding=utf-8 #!/usr/bin/ ...

  3. Postgresql 迁移随笔一

    最近忙于MSSQL 迁移到Postgresql的工程,在这里记录一下迁移遇到的问题以及解法. 程序语言:java 要求,根据不同的driver可以同时支援多种数据库,目前主要为MSSQL 和Postg ...

  4. (String). Word Pattern

    Given a pattern and a string str, find if str follows the same pattern. Here follow means a full mat ...

  5. STL容器

    啦啦啦,今天听啦高年级学长讲的STL容器啦,发现有好多东西还是有必要记载的,毕竟学长是身经百战的,他在参加各种比赛的时候积累的经验可不是一天两天就能学来的,那个可是炒鸡有价值的啊,啊啊啊啊啊 #inc ...

  6. setContentType、setCharacterEncoding、pageEncoding和contentType

    request.setCharacterEncoding()是设置从request中取得的值或从数据库中取出的值 response.setContentType("text/html;cha ...

  7. MFC 单文档消息执行顺序。

    theApp构造, InitInstance void CMyFrameWnd::OnGetMinMaxInfo(MINMAXINFO* lpMMI) BOOL CMyFrameWnd::OnNcCr ...

  8. S2SH CRUD 整合

    采用的框架 Struts2+Spring4+Hbiernate4. 目录结构 :    EmployeeAction: package com.xx.ssh.actions; import java. ...

  9. master-slave

    Redis的master/slave数据复制方式可以是一主一从或者是一主多从的方式,Redis在master是非阻塞模式,也就是说在slave执行数据同步的时候,master是可以接受客户端的请求的, ...

  10. js学习笔记（一）

    js 有5中原始类型:number. string. boolean. null.undefined js 有6中类型: 5中原始类型 在加上1中Object类型 typeof null === 'o ...