Head first HTML&CSS学习笔记

  1. 通过<head>来告诉浏览器关于web页面的信息。
  2. <title>总出现在浏览器窗口的顶部。
  3. <body>是你看到的东西。
  4. css在html文件中嵌套:<style type=“text/css”>xxx</style>
  5. 使用<a>元素创建一个超文本链接,链接到另一个web页面;<a>元素的内容会成为web页面中可单击的文本;href属性告诉浏览器链接的目标文件。
  6. H5支持定制数据属性,允许为新属性构造定制的属性名。
  7. href:“超文本引用”(hypertext reference),就是互联网或者你的计算机上的一个资源的别称,href可以指向各种资源的。
  8. 如果把一个<img>元素放在<a>元素之间,则这个图像也就像文本一样可单击。
  9. href可以指向相对路径也可以指向绝对路径。相对路径是相对于连接的源web页面指向网站中其他文件的一个链接。
  10. 为网站选的文件名和文件夹中不要使用空格。
  11. <q>内联引用
  12. <blockquote>块引用
  13. <br>换行(全写:<br></br>).
  14. 如果一个元素设计为没有任何实际内容,我们就是用它的简写来表示这个元素。这些元素叫做void元素。
  15. <ol>与<ul>被设计为只能包含<li>元素。
  16. HTML中字符实体清单:http://www.unicode/org/charts/
  17. 使用适宜的时候用其编号也是可以的:w3cschools上有
  18. www.shorewb.com   www 是域中的一个特定服务器的名字;shorewb.com才是域名,域名可以用于多个网站
  19. FTP命令:
  • dir:得到当前目录的文件列表
  • cd
  • pwd
  • put <filename>:将指定的文件传送到服务器
  • get <filename>:从服务器获取指定的文件,传回你的计算机
  1. 用/来表示根文件夹
  2. URL:统一资源定位符,是一个全局地址,可以定位web上的任意资源,包括html页面、音频、视频和其他形式的web内容。除了指定资源的位置,URL还可以指定用来获取资源的协议。
  • http://www.shorewb.com/index.html
  • http是指获取资源的协议,http协议在web上传输超文本文档的协议
  • www.shorewb.com是网站名
  • index.html是从根文件夹到资源的绝对路径(告诉服务器如何从你的根文件夹到达某个指定的页面或文件)
  1. 所有web服务器看到的都是绝对路径。有浏览器根据相对路径生成绝对路径。
  2. 如果请求一个目录的时候,它会尝试查找这个目录中的一个默认文件。通常默认文件名为“index.html”或是“default.htm”(取决于你的托管公司使用哪种web服务器),如果服务器找到这样一个文件,就会把它返回给浏览器显示。
  3. 就算你请求的没有“/”,而且这个目录确实存在,服务器就会帮你加上末尾的斜线。
  4. URL不仅可以在浏览器中输入,还可以在html文件中使用。可以把URL放在一个<a>元素中。
  5. 应当使用相对链接来链接同一个网站中的页面,而是用URL来链接其他网站上的页面。
  6. 当浏览器从你的计算机本地读取文件时会使用file协议。如果要输入一个文件URL,则要注意URL有三个斜线而不是两个。可以这样来记:如果删去http URL中的网站名,那么也会有三个斜线。
  7. 还有其他协议:FTP、mail。
  8. :8080是一个可以放在HTTP URL中的可选的端口。通常web上的所有东西都会传送到默认的端口,不过有时web服务器会配置为在另一个不同的端口来接受请求。正常的web服务器几乎都在端口80接收请求,如果没有指定端口,则默认为80。
  9. <a>元素有一个title属性就是用来提供链接信息的。
  10. href=“index.html#chai”会跳转到指定的id处。
  11. 在所有的元素中,属性的顺序不是那么重要。
  12. 可以为任何元素添加title属性;可以为任何元素添加id属性。
  13. 链接到一个新窗口:target=“_blank”。target属性告诉浏览器在哪里打开href中链接只是的web页面。如果没有target,那么就会在同一窗口中打开这个链接。如果目标是”_blank”就会在一个新窗口中打开链接。如果指定了一个名字(eg.shorewb,则总会在这个shorewb窗口中打开web页面)
  14. 浏览器在看到一个<img>元素时,会做不同的处理,浏览器在页面中显示图像之前,要先获取到这个图像。
  15. JPEG不支持透明度。
  16. scr属性不只可以用于相对链接,还可以放上URL。Web上每幅图像都有自己的URL。
  17. <img>元素属性:
  • src
  • alt
  • width(px)
  • height(px)  如果没有指定宽度和高度,则浏览器在页面中显示这个图像之前会自动确定图像的大小。
  1. <img>元素是内联元素,在显示的时候不会在元素前后自动的插入换行。
  2. 一旦把<img>元素放在一个<a>元素中,浏览器就会把这个图像当做一个可点击的链接。
  3. H5的doctype:<!doctype html>
  4. 一定要物尽其用,使用最合适的元素完成它最擅长的工作。
  5. 在H5中使用一个<meta>来指定字符编码: <meta charset=“utf-8”>。为服务器提供的文件要与<meta>标记中指定的编码一致。在HTML 4.01中:<meta http-equiv=“Content-Type” content="text/html;charset=utf-8">
  6. 写HTML页面的时候必须要写doctype和指定字符集。
  7. <head>包含有关页面的信息。所以<meta>标记放在<head>元素中。
  8. HTML指南
  • 一定要以<doctype>开头
  • 在<doctype>元素之后,开始你的<html>
  • 只有<head>和<body>能放在<html>中,所有其他元素必须放在<head>和<body>中
  • 在<head>中指定正确的字符编码。
  • 一定要在<head>中包含一个<title>元素。只能在<head>元素中放置<title>、<meta>、<style>元素。(看来script元素应该放在<body>中)
  • 不要把<a>元素嵌套在另一个<a>元素中。不允许在空元素中嵌套其他元素。
  1. 在<style></style>中写css。
  2. CSS中对两个元素进行选择:在两个元素中间加逗号 :“,”。eg(h1,h2{})
  3. <link>元素可以用来向html文件中添加外部样式表。用法:<link type=“text/css” rel=“stylesheet” href=“XXX.css">
  • 使用link元素“链入”外部信息
  • type说明外部信息的类型
  • rel指定了HTML文件与所连接文件之间的关系。这里连接到一个样式表,所以使用值“stylesheet”。
  • 样式表路径放在href中。(可以是相对路径也可以是一个url)。
  1. 改变字体的样式是”font-family"
  2. CSS注释:   /*xxx*/
  3. html注释:<!—xxx—>
  4. 创建一个类有两步:
  • 首先为HTML中的元素增加一个class属性,这样就把这个元素加入到这个类中了。
  • 在CSS中选择这个类(使用点号   “.”)
  1. CSS中选择属于某个类的元素: p.greentea(元素名.类名)
  2. 在CSS中选择属于某个类的所有元素:.greentea(.类名)
  3. 元素可以加入多个类。eg:<p class=“greentea redtea blueberry”>类名之间用空格隔开。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值