初识html（5.15）简单css样式和基本格式

W3C能查阅一切格式代码及其使用方法

HTML基本标签

名称	标签	实例
标题标签	<h1>~<h6>	<h1>这里输入你的内容</h1>
段落和换行标签	<p>.....</p> ←这是换段落   、   <br/>←这是换行	<p>床前明月光<br/>疑是地上霜</p>
水平线标签	<hr/>	<hr/>
斜体	<em>..............</em>	<em>举头望明月</em>
字体加粗	<strong>.............</strong>	<strong>低头思故乡</strong>

插入图片格式↓
<img src="图片路径" alt="替换文本" width=" "px height=" "px/>
若不需要调整图片大小可以不用填写后面的长度和高度，他们的单位都是px。，

插入超链接格式↓
<a href="链接地址" target="目标窗口位置">文本或图像</a>
                                             ↑ _self:自身窗口
                                             ↑ _blank：新建窗口打开
若要使用锚链接格式↓
首先定义一个标记点 锚<a name="这里输入你需要定义锚的名字">

其次跟使用超链接一样    <a href="#+你刚定义锚的名字" >文本或图像</a>
                                                      ↑若需要转去别的网站的锚，可以在#号前面+网站地址
超链接还能发送邮件(前提是你电脑有安装邮箱客户端):<a href="邮箱地址">文本或图像</a>

注释和特殊符号

特殊符号	字符实体	实例
空格	&nbsp;	<a href="#">百度</a>&nbsp;
大于号(>)	&gt;	如果时间&gt;晚上6点，就坐车回家
小于号(<)	&lt;	如果时间&lt;早上7点，就走路去上学
引号(")	&quot;	W3C规范中，HTML的属性值必须用成对的&quot;引起来
版权符号@	&copy;	&copy;2003-2013北大青鸟

插入视频音频格式↓
由于部分浏览器问题不支持一些格式的播放，所以我们需要添加source添加到src前面
<video controls>
 <source src="视频路径.mp4"  type="类型说明"/>
 <source src="视频路径.webm"  type="类型说明"/>
</video> 
                                     controls ←这个指的是提供播放展厅和音量的控件，这个必须要有
                                      autoplay   ←这个指的是自动播放
< audeo controls>
      <source src="音频路径.mp4"  type="类型说明"/>
     <source src="音频路径.webm"  type="类型说明"/>
</audeo>

HTML布局基本格式↓

元素名	描述
header	标题头部区域的内容(用于页面或页面中的一块区域)
footer	标记脚部区域的内容(用于整个页面或页面的一块区域)
section	Web页面中的一块独立区域
article	独立的文章内容
aside	相关内容或应用(常用于侧边栏)
nav	导航类辅助内容

初始CSS
一般在头部header范围内定义style来设置下面的格式。
选择器分为三个 1.标签选择器(下面格式中选择器为h1、p等)    2.类选择器(.+需要定义的选择器名字)      3. ID选择器(#+自定义名字)
标签格式：    标签选择器{   声明1;                     例子→           h1{         
                            声明2;                                                 font-size:12px;
                            声明3;                                                  color:#ff0000;
                           }                                                           }

类选择器格式：    .自定义选择器名字{   声明1;                     例子→           .自定义名字{         
                            声明2;                                                                                 font-size:12px;
                            声明3;                                                                                 color:#ff0000;
                           }                                                                                          ｝

ID选择器格式：   #自定义选择器名字{   声明1;                     例子→           #自定义名字{         
                            声明2;                                                                                 font-size:12px;
                            声明3;                                                                                 color:#ff0000;
                           }                                                                                          ｝

需要使用css样式有三种方法
1.内容定义为<p>    <h1>等基本格式，再用标签选择器自定义样式。但定义后所有标签选择器修改的基本格式都会修改
2.类选择器 在需要定义格式的内容前+class="类选择器的名字" 如→        <p class="red">文字变成红色啦</p>
3.ID选择器 在需要定义格式的内容前+id="ID选择器的名字"    <p id="blue">文字变成蓝色啦</p>
ID选择器只能给一个内容使用一次，类选择器与标签选择器可以重复使用。
他们三个方法之间的优先级是：ID选择器＞类选择器＞标签选择器
若一个内容同时被三种选择器同时修改，那么会按照优先级覆盖，比如ID选择器中只修改了颜色，类选择器中修改了字体大小。那么该内容会使用ID选择器中的颜色，同时也会使用类选择器中的字体大小。

引用css的三种方法
1.内部样式表 → 在表头(header)中用<style> 定义选择器 </style>
2.内联样式  →  直接在该行内容修改如： <p style="color=yellow;font-size:25px;">内容</p>
3.外部样式表→首先要在外部创建一个css文件，把样式在开头导入到这个文件中   <link rel="stylesheet" href="该样式文件地址"/>                                                                                                                   ↑这个stylesheet必须+，否则无效         
还有另外一种不建议使用的外部样式方法→@import "需要导入的文件地址"    这个方法会有很多局限性，因为其是先把整个网页的内容显示后再去设置css样式，而且对部分老实浏览器不兼容。