认识前端
W3C:是目前Web技术领域最具权威和影响的技术标准机构。
HyperText(超文本):不只包括文本,也可以包含图片,链接,音乐,视频等 非文本资源。
要点:图片尺寸,存储位置。
认识HTML
HTML:框架,布局;Css:样式;Js:互动,交互。
HTML:使用标记标签来描述网页。
书写格式:
HTML注释主要用于,描述代码功能。
浏览器解析HTML代码时会忽略注释内容。
HTML元素:HTML文档是由大量元素组成,又叫做根元素(标记),是所有元素的祖先元素,文档中所有其他元素,都必须放在它的元素中。
嵌套结构:两个元素不能相互嵌套。
格式:(起始标记)–元素内容(结束标记)
<标记名,属性,元素内容共同决定了一个元素的显示内容和行为>
元素含义
head元素:叫做文档头,是html的第一个子元素(head元素内容不会显示到页面上)----包含以下元素
标识文档标题,会显示在浏览器的标题栏或标签页上。
标识页面的其他元素数据(页面相关信息),这是一个空元素。
空元素:没有元素内容和结束标记。
:又叫文档体,网页中所有可见内容都放置在该元素中,可以包含大量的其他元素,定义文档的内容结构。
**访问路径**
绝对路径:1.访问站外资源时,只能用绝对路径。2.访问站外资源时,若网站部署到服务器,可以使用绝对路径,并且可以省略协议和域名。
相对路径:只能用于访问站内资源。
书写格式:../路径(../表示上一级目录,返回几个目录,就用几个../)
**引用Css**
外部样式表:1.实现了内容结构和表现形式代码分离,方便复用和维护。2.使html代码更加纯净有利于程序员和搜索引擎的阅读(因为搜索引擎只抓取html元素)
内部样式表(只能用于测试)
特点:没有了样式表文件,在某些时候可以提升效率
缺点:1.多个页面难以共享样式,不利于代码复用。2.html和css代码混杂,不利于程序员和搜索引擎阅读。3.在某些时候对效率要求苛刻或测试的场景不同。(行内样式表与内部样式表一样)
**选择器**
基础选择器(元素选择器)
格式:标记名{/*声明块*/}----所有与该标签名匹配的元素,都将应用声明块的规则。
类选择器
格式:.类名{/*声明块/*}
所有class属性为指定类名的元素,都将应用生凝块的规则。
要点:把两个选择器运用到一个类选择器上。
**ID选择器**
格式:#id值{/*声明块*/}
属性id为指定值的元素,将应用声明块的规则。
在同一个html文档中,元素的id值必须唯一。
不同页面中的id值是可以重复的,每一个声明结束符为;
**页面元素部署**
<header>--用于表示页面或某个区域的头部
用于表示导航栏---<nav> <aside>用于表示跟周围主题的相关信
用于表示文章或独立页面 的内容 <section>--用于表示部分主题
<footer>用于表示页面或某个区域的脚注
</footer></section></aside></nav></header>