html和CSS基础学习

(1)<meta />用来设置关键字；用来对网页的描述，请求重定向（5秒跳转的页面）

<a>超链接 src表示路径，herf表示地址

<img>标签 插入图片 src图片的路径 相对路径，alt属性表示对图片的说明（搜索引擎）

<iframe>标签 可以使用内联框架引入一个外部的页面;

(2)css样式<style>标签

<link>将外部的CSS文件引入

/**/CSS的注释

CSS中选择器和声明块

选择器：页面中的制定元素

声明块：{}后面;

常用的选择器有：

                         （1）元素选择器例如 p{}；相同标签全部选中

                         （2）ID选择器 <p id="sm"> #sm{}; 选中一个

                         （3）类选择器

<pclass="sm"> <p class="sm"> <pclass="sm"> .sm{} ；一类标签选中

                         （4）选择器分组，并选择器，#p1,.sm,h1{} 包含，类选择，ID，标签，交集

                         （5）交选择器：公共部分

                        （6）伪类选择器 就是表示元素的一直特殊状态，被点击，鼠标滑过，访问过的连接等。

(3)块元素和内联元素

<div>独占一行 标签作用对网页进行布局；<span>并排

内联元素：<a>,<img>,<iframe>,<span>

伪类选择器：{

a:link //普通的超链接

a:visited//访问过的超链接

a:hover//表示鼠标移动的连接

a:active//行为，超链接被点击的状态。

hover和active也可以用于别的标签

IE6游览器不支持超链接以外的元素设置

（4）伪元素选择器《input/》创建一个文本输入框，获取焦点 input:focus ::section表示选中字体的时候

P:before{

   content:"出现在标签的最前面";通过CSS添加的，无法被选中

}

 

 

}

（5）属性选择器

每个元素都可以+上一个title属性，title属性表示在鼠标移入时，title属性作为文字提示

p[title="sn"]表示P标签中title属性=SN的 p[title^="sn"] ^运算符表示或，SN开头的，$表示结尾，*表示有SN就行

（6）子元素的伪类

例如：  p:first-child{

                                  background-color:red;

                         }

表示是P标签而且必须是第一个子元素

span >p:first-child{

                                  background-color:red;

                         }

表示是span元素中的P标签而且必须是第一个子元素

p:nth-child(2){

                                  background-color:red;

                       }nth表示任意位置的子元素p:nth-child(2)参数可以自己设置：

p:nth-child(even)even表示偶数位置 odd表示奇数位置

p:frist-of-type 表示第一个标签

（7）否定伪类选择器；为了去除一些我们选中的元素例如

p:not(.hello)

<pclass="hello">  除了这个以外所有P标签的元素

（8）CSS样式的继承

为元素父元素设置样式，也会被子元素继承

<pfont-size=50px >字体变大

    <span>同样也会变大</span>

  </p>