zoukankan      html  css  js  c++  java
  • CSS概述

    什么是css,有什么作用?

    CSS指层叠样式表(Cascading Style Sheets)。
    CSS的作用是:修饰HTML页面,设置HTML页面中的某些元素的样式,让HTML页面更好看。

    修饰HTML

    CSS好比是HTML的化妆品。HTML还是主体,CSS依赖HTML。CSS的存在就是修饰HTML。
    样式通常保存在外部的 .css 文件中。CSS样式表极大的提高了工作效率,通过仅仅编辑一个简单的 CSS 文档,外部样式表使你有能力同时改变站点中所有页面的布局和外观。

    多页面应用同一个样式

    通常保存在外部的独立的.css文件(该文件不属于任何页面文件)可以在多个页面中使用同一个CSS样式表。通过在任何的页面文件中引用.css文件,可以设置具有一致风格的多个页面。

    样式层叠

    样式层叠就是对一个元素多次设置同一个样式,这将使用最后一次设置的属性值。

    将样式表加入网页的三种方式

    当同一个 HTML 元素定义了多个样式时,应该使用哪个样式?
    一般而言,所有的样式会根据下面的规则层叠于一个新的虚拟样式表中,其中数字 4 拥有最高的优先权。

    浏览器缺省设置(默认)
    外部样式表

    1、先建立外部样式表文件(.css),然后使用HTML的link对象。
    2、这种方式最常用。将样式写到一个独立的.css文件当中,在需要的网页上直接引入css文件,样式就引入了。
    3、示例

    <head>
    <title>文档标题</title>
    <link rel=stylesheet href="http://www.dhtmlet.com/dhtmlet.css" type="text/css">
    </head>
    

    在XML中,应该如下例所示在声明区中加入:

    <? xml-stylesheet type="text/css" href="http://www.dhtmlet.com/dhtmlet.css" ?>
    
    内部样式表(位于<head>标签内部)
    	<head>
    		<style type="text/css">
    			选择器{
    				样式名:样式值;
    				样式名:样式值;
    				...
    			}
    			选择器{
    				样式名:样式值;
    				样式名:样式值;
    				...
    			}
    		</style>
    	</head>
    

    例子:

    		<style type="text/css">
    			<!--
    			body {
    			font: 10pt "Arial"
    			}
    			h1 {
    			font: 15pt/17pt "Arial";
    			font-weight: bold; color: maroon
    			}
    			h2 {
    			font: 13pt/15pt "Arial";
    			font-weight: bold;
    			color: blue
    			}
    			p {
    			font: 10pt/12pt "Arial";
    			color: black
    			}
    			-->
    		</style>
    
    内联样式(在 HTML 元素内部)
    <标签  style="样式名:样式值;样式名:样式值;..."></标签>
    

    例子:

    <p style="margin-left: 0.5in; margin-right:0.5in">这一行被增加了左右的外补丁<p> 
    

    因此,内联样式(在HTML元素内部)拥有最高的优先权,这意味着它将优先于以下的样式声明:<head> 标签中的样式声明,外部样式表中的样式声明,或者浏览器中的样式声明(缺省值)。

  • 相关阅读:
    Python-快速入门
    Python-面向对象编程
    python-模块
    .net mvc onexception capture; redirectresult;
    a c lang in linux
    上海哪里有学陈氏太极拳?
    【Origin】 叹文
    【Origin】 碑铭
    【Origin】 偶题 之 抒意
    【Origin】答友朋关切书
  • 原文地址:https://www.cnblogs.com/yu011/p/13514884.html
Copyright © 2011-2022 走看看