前端语言 |HTML CSS 1-3

127 阅读3分钟

From Head First HTML CSS

1 认识HTML

  • web页面

创建用超文本标记语言(HTML)编写的文件,并把它们放在web服务器上。

  • web服务器

服务器就是一个连接到互联网的计算机,在等待着来自浏览器的请求。每个服务器都会存储HTML文件,图像,声音和其它类型的文件。

  • web浏览器

浏览器的作用就是向服务器发出请求。

  • 元素=开始标记+内容+结束标记
  • 开始标记可以有属性,如style

元素放在HTML首部,style的一个type属性能告诉浏览器你在使用什么样的样式。一般使用CSS,可以为<style type='text/css'></style>(现在一般都默认为CSS格式,故可以不写)

  • HTML(HyperText Markup Language)是超文本标记语言,用来建立网页结构。CSS(Cascading Style Sheets)是层叠样式表,用来控制HTML的表现。也就是说HTML是人体框架,CSS是骨骼,JS是血肉。
  • 所有页面都要有一个html元素,其中至少要有一个head和body元素。网页信息放入head,body就是浏览页面的内容。
  • style元素写CSS规则,为HTML网页增加CSS,<style>元素总要放在<head>元素中。

2 初识HT

  • <a>

<a>创建超文本链接,链接到另一个web页面。<a></a>元素中的内容成为web页面中可单击的选项,也是链接的标签,文字或者图像都可以。href属性告诉浏览器链接的目标文件。eg:<a href='top.html'>Great Movies</a>

  • 组织结构文件链接

../回退到父级

3 Web页面的建设

  • <q>元素-短引用

<q>to be or not to be</q>,显示效果:to be or not to be

  • <blockquote>元素-长引用

它是块元素,不同于<q>内联(inline)元素。块元素显示时前后各有一个换行,内联元素在行内出现。
块元素:<h1>...<h6> <p> <blockquote>
内联元素:<q> <em> <a>-根据上下文既可以是块元素也可以是内联。<br>不属于这两者中的任何一个。
块元素往往用作Web页面中的主要构件模块,内联元素往往用来标记小段内容。

  • <br>元素-换行

是一种内容为空的元素,也叫空元素或者void元素,常见的如<img>元素,故可以不写结束标记。<br/>与之意义相同,这是在XHTML处理时更加严格的表达形式。

  • <li>元素(list item)

<li> 今天是周三</li>,存放一个列表项

  • <ol>-有序列表(ordered list) <ul>-无序列表(unordered list)

使用方法:
<ol>
<li>第一项</li>
<li>第二项</li>
</ol>

  • <dl>-定义列表

列表中每一项都有一个定义术语<dt>和定义描述 <dd>
<dl>
<dt>Burma Shave Sings</dt>
<dd>Road signs common in the us in the 1920s and 1930s advertising shaving products.</dd>
</dl>
效果:

Burma Shave Sings
Road signs common in the us in the 1920s and 1930s advertising shaving products.

  • 字符实体

www.w3schools.com/html/html_e…
文档中编号也可以用来代指对应的实体符号,有的没有名称只能编号。
www.unicode.org/charts
注:&符号很特殊,它是所有实体符号的第一个字符,在实体名中使用是可以直接使用的,但是单独表示时要用&amp; &#208;&epsilon;&tau;&#114;&ouml;&igrave;&tau;
效果: Ðετröìτ