一。CSS引用

1. 使用外部样式表：    CSS代码在一个独立的文件中，HTML通过link元素引入到页面

    格式：link + tab键<link rel="stylesheet" herf"../目标"> 

特点：

- 实现了内容结构和表现形式的代码分离，方便复用和维护

- 使HTML代码更加纯洁，有利于程序员和搜索擎的阅读

2.使用内部样式表：   将CSS代码写到HTML文档的style元素内容中

    格式：<stely>样式</stely>

特点：

没有了样式表文件，在某些时候可以提升效率；

多个页面难以共享样式，不利于代码复用；

HTML和CSS代码混乱，不利于程序员和搜索擎阅读，不利于复用和维护；

在某些对效率要求苛刻或测试的场景下使用

一个样式表可以引用多个页面，一个页面也可以引用多个样式表

3.使用行内样式表：又叫内嵌样式表，CSS代码写在某个元素的开始标记中，行内样式不写选择器（放入body标签里）

         书写格式：<开始标签 属性名=“属性值”>        <结束标签>

特点：相对于使用内部样式表，行内样式表大多进行JS操作，同时也在测试的场景下使用

注意：行内样式表优先级最高

CSS术语

     CSS注释书写格式：  /*注释内容*/

作用：   方便自己和维护员修护  描述代码功能  解析CSS

CSS的规则：

css代码由一个一个的规则组成  

 

         书写格式：选择器  { 声明块 }

选择器：该样式规则应用到哪些元素上

声明块：有哪些样式

元素选择器：  标签元素名

 

书写格式：{ /* 声明块 */ }

所有与该标记名匹配的元素，都将应用声明诀中的规则

类选择器：

            书写格式：.类名{/* 声明块 */}

所有class属性为指定类名的元素，都将应用声明诀中的规则；多个类名在HTML代码中，中间要用空格分开

ID选择器：

       书写格式：#id值{/* 声明块 */}

在同一个HTML文档中，元素的id值必须唯一

二。HTML 语义化概述

意义：HTML中不同的元素代表不同的含义；使用具有含义的元素来书写HTML文档，即语义化；语义化属于HTML范畴，与样式css无关

作用：有利于浏览器理解HTML文档；有利于搜索擎理解HTML文档结构的理解；

div元素：用来划分区域，不具备任何意义

<header>：用于表示某个页面的头部，同一个页面header可以出现多次

<nav>：导航栏

<aside>：用于表示跟周围主题相关的附加信息（侧边栏）

<article>：用于表示文章或独立页面存在的内容

<section>：用于表示一个整体部分的主题

<footer>:脚部

单词快捷键：lorem+tab键

< a >超链接

书写格式：< a href="目标"> 内容 </ a>

或<a target="页面打开位置" href="目标">  内容  </ a>

链接的目标指：页面地址（路径）；锚点；功能的链接

target="页面打开位置"是指：点击后在哪里打开新文档

_blank新窗口打开

_self默认值 当前窗口打开

注意：属性名小写，属性值加双引号