zoukankan      html  css  js  c++  java
  • CSS基础——css样式的四种方式

    css样式有四种,行内样式、内部样式、外部样式、导入样式。

    行内样式>内部样式>外部样式>导入样式
    内部样式>外部样式的前提:内部样式要在外部样式后面

    行内样式:<h1 style="color:orange;">哈哈</h1>
    内部样式:
            <style>
                div{
                    color: lawngreen;   
                }
            </style>
    外部样式:<link rel="stylesheet" href="css/css01.css" />
    导入样式:
            <style>
                @import url("css/css01.css");
            </style>

    具体代码如下:

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    		<link rel="stylesheet" href="css/css01.css" />
    		<style>
    			@import url("css/css01.css");
    		</style>
    	</head>
    	<body>
    		<p>呵呵</p>
    		<h1 style="color: lawngreen;
    				background-color: orange;">哈哈</h1>
    		<div style="color: blue;
    				background-color: red;">哎呀</div>
    	</body>
    </html>
    

     css/css01.css的代码如下:

    p{
    	font-size: 30px;
    	color: blue;
    	font-family: "微软雅黑";
    }
    h1{
    	font-size: 40px;
    	color: yellow;
    	font-family: "微软雅黑";
    	background-color: #0000FF;
    }
    

    效果如图所示:

  • 相关阅读:
    MSSQL中with(nolock)的用法
    google reader 使用快捷键
    HTML中em标签的用法
    js正则表达式
    C#中lock关键字的用法
    面试反思
    关于IE6.7.8.FF兼容的问题
    C#中DateTime.Now.Ticks的用法和说明
    JS中eval的用法
    这两天面试时不会的笔试题
  • 原文地址:https://www.cnblogs.com/LJNAN/p/12745448.html
Copyright © 2011-2022 走看看