Html+Css

(一)html标签部分

 p标签--->表示一个段落

       

      h标签--->标题标签 

       

      网页中一般只用:h1、h2、h3这个三个标签。并且h1标签在一个网页中有且只有一个,一般用于网页的标题。

       

      div标签--->可以理解为盒子容器

       

      a标签--->链接标签

       

      比如要跳转到百度<a href="www.baidu.com">百度</a>

       

      img标签--->在网页中引用图片

      比如我要链接一张图片:<img src="图片地址" width="" height="" alt=""/>

       

      注:假设有一张1.jpg的图片,若该网页和图片在同一级目录,那么地址为:src="1.jpg"。

      如果在某个文件夹下,就在前面加该文件名称,有多少层级加多少。依次类推。比如图片在images文件夹下,那么地址就为:src="images/1.jpg"。

       

      br标签--->换行

       

      span标签--->行内标签

       

      strong标签--->加粗效果,强调定义的文本内容很重要。

       

      table--->表格标签

      定义一个表格里面有tr标签(行)td标签(列)th标签(一般用于表格的标题)

       

      ul--->无序列表

       

      ol--->有序列表

(二)CSS部分

CSS（层叠样式表）可以理解成人穿的衣服。只要更换CSS，就相当于给网页换了一套漂亮衣服。在CSS部分，我觉得有以下几个知识点需要注意：

 

(1)CSS语法

 

(2)CSS的几种引用方式

1.行内样式

    

比如:<p style="width:120px;height:30px;border:1px solid red;"></p>

   

2.内嵌样式

 比如:<style>

       p{width:120px;height:30px;border:1px solid red;} 

    </style>

         

3.外部引用样式   

   <link rel="stylesheet" type="text/css" href="样式列表地址"> 

    

   <style type="text/css">@import url("样式列表地址");></style> 这种基本上比较少用（但也要知道）

 

(3)CSS选择器

 

1.标签选择器

  html标签：比如：P标签  div标签 span标签....

  

  p{color:red;}   

   

2.Class选择器

  以"."开头的为Class选择器 .p{color:red;}

   

3.ID选择器

  以"#"开头的为ID选择器，一般来说，一个ID选择器在一个页面中具有唯一性，有且只存在一次。

  

  #p{color:red;}

  

4、后代选择器

  比如：我们要给 h1 标签下面的em 标签添加样式

      

  html：<h1>This is a <em>important</em> heading</h1>

      

  css: h1 em {color:#c34;}

      

5、子元素选择器 （>）

     

   比如：我们要给H1标签的子元素（strong）添加颜色

     

  html: <h1>This is <strong>very</strong> <strong>very</strong> important.</h1> 

   

      <h1>This is <em>really <strong>very</strong></em> important.</h1>

       

  css: h1 > strong { color:red}