css学习笔记（二）

最新推荐文章于 2023-08-12 20:56:17 发布

iteye_4392

最新推荐文章于 2023-08-12 20:56:17 发布

阅读量119

点赞数

13，编写头部的css

因为要将css文件定义在HTML文件头部的方法为内部样式表方法，所以下面举例说明怎么应用内部样式表方法在HTML文件的头部编写css

（1）打开记事本，在记事本中输入如下一段普通的HTML代码，然后将代码文件以扩展名.html的形式保存

实例代码：

 
   view plain 
  
 < html >     
 < head >     
     < title > 编写头部css文件 </ title >     
 </ head >     
 < body >     
     < h3   align = "center" >     
     编写头部css文件   
     </ h3 >     
     < p >     
     在HTML文件的头部应用内部样式表方法添加css   
     </ p >     
 </ body >     
 </ html >     

（2）在上面代码中的<head>与</head>之间插入如下代码

 
   view plain 
  
 < style   type = "text/css" >     
 <!--   
     h3{color:black; font-size:35px; font-family:黑体}   
     p{background:yellow; color:red; font-family:宋体}   
 -->     
 </ style >     

（3）保存后在浏览器中打开文件，需要注意的是文件的扩展名必须保存为.html格式

14，编写主体的css

将css文件定义在HTML文件主体的方法为嵌入样式表方法，下面举例说明怎么应用嵌入样式表方法在HTML文件的主体编写css

实例代码：

 
   view plain 
  
 < html >     
 < head >     
     < title > 编写主体css文件 </ title >     
 </ head >     
 < body >     
     < center >     
         < h1   style = "color:green; font-size:35px; font-family:黑体" >     
         编写主体css文件   
         </ h1 >     
     </ center >     
     < hr >     
     < p   style = "backgrount:cyan; color:red; font-size:25; font-family:隶书" >     
     在HTML文件的主体应用嵌入样式表方法添加css   
     </ p >     
 </ body >     
 </ html >     

15，编写外部的css---应用链入外部样式表方法在HTML文件内调用外部定义的css文件

（1）打开记事本，输入如下一段css文件的代码。

 
   view plain 
  
 < style   type = "text/css" >     
 <!--   
     h3{color:black; font-size:35px; font-family:黑体}   
     p{backgroud:orange; color:blue; font-size:25; font-family:隶书}   
 -->     
 </ style >     

（2）建立一个新的HTML文件，并连接到上面定义的css文件上

实例代码：

 
   view plain 
  
 < html >     
 < head >     
     < title > 编写外部css文件 </ title >     
     < link   rel = stylesheet   type = "text/css"   href = "1.css" >     
 </ head >     
 < body >     
     < h3   align = "center" >     
     编写外部css文件   
     </ h3 >     
     < p >     
     在HTML文件应用链入外部样式表方法调用外部的css   
     </ p >     
 </ body >     
 </ html >     

（3）打开网页显示效果

16，编写外部的css----应用导入外部样式表方法在HTML文件内调用外部定义的css文件

（1）建立如下的HTML文件

实例代码：

 
   view plain 
  
 < html >     
 < head >     
     < title > 编写外部css文件 </ title >     
     < style   style = "text/css" >     
         @import url(1.css);   
     </ style >     
 </ head >     
 < body >     
     < h1   align = "center" >     
     编写外部css文件   
     </ h1 >     
     < hr >     
     < p >     
     在HTML文件中应用导入外部样式表方法调用外部css   
     </ p >     
 </ body >     
 </ html >     

（2）再建立单独的css文件，代码如下

在实际应用过程中，HTML文件和css文件编写的先后顺序是很灵活的，但较多人倡导先编写好css文件，然后在HTML文件中调用它

 
   view plain 
  
 h1{color:blue; font-size:30px; font-family:黑体}    
 p{background:pink; color:black; font-size:20; font-family:宋体}   

（3）在浏览器中天打开上面建立的HTML文件，查看代码的显示效果

iteye_4392

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
css学习笔记（二）

13，编写头部的css因为要将css文件定义在HTML文件头部的方法为内部样式表方法，所以下面举例说明怎么应用内部样式表方法在HTML文件的头部编写css（1）打开记事本，在记事本中输入如下一段普通的HTML代码，然后将代码文件以扩展名.html的形式保存实例代码：view plain&lt;html&gt; &lt;h...
复制链接

扫一扫