• 我的CSS笔记(一)


    CSS简介

    1.CSS(Cascading Style Sheets) 层叠样式表  

      CSS能够对网页中的对象的位置排版进行像素级的精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力,并能够进行初步交互设计,是目前基于文本展示最优秀的表现设计语言。

    2.CSS的语法结构  

      CSS语法有三部分:选择符属性。属性(property)是用户希望设置的属性(style attribute)。每个属性有一个值。属性和值由冒号分开。

      Selector {Property:Value }  Selector:选择符;  Property:属性;  Value:属性值;

      例子:

       <style type="text/css"> body { background-color:#cccccc;} </style> 

    3.CSS的三种引用方式

      (1)行内引用

      行内引用是指将CSS样式编码直接写在HTML标签中的style属性中。这种方式引入CSS不需要写选择器。

      例子:  

    <body style="background-color:#ccccc;">
    
    <h1 style="font-size:12px; color:#ff0000;">这是一个标题</h1>
    
    </body>
    <body style="background-color:#ccccc;">
    
    <h1 style="font-size:20px; color:#0000ff;">这是另一个标题</h1>
    
    </body>

      效果:

    这是一个标题

    这是另一个标题

      (2)页内引用

      页内引用作为页面中的一个单独部分,由<style></style>标签定位在<head></head>中。

      例子:  

    <head>
        <style type="text/css">
            body {
                background-color:#cccccc;
                }
        </style>
    </head>

      (3)外部样式表

      外部样式表是CSS应用中最好的一种形式,它将CSS样式代码单独放在外部文件中,再由网页进行调用。

      例:

       style.css : body { background-color:#cccccc; } 将它放在外部CSS文件夹中  

    <head>
    <link rel="stylesheet" type="text/css" href="style.css" />
    </head>

      将这段代码放在如index.html的文件中,即可调用CSS样式。

      三种引入方式的优先级依次为:行内引用 > 页内引用 > 页外引用  需要注意的是它们首先遵从就近原则。

    4.CSS代码注释

      CSS的代码注释与HTML不同,它以 /* 开始,以 */ 结束。

      例:

    /* 公共样式*/
    
        body { margin:0px; padding:0px;}    
        
        /*导航样式开始*/
        
        #nav {
          ……
        }
    
        /*导航样式结束*/
  • 相关阅读:
    CF566E Restoring Map
    CF1034D Intervals of Intervals
    CF1285F Classical?
    Java日报
    课程考核感想
    每日日报8月31日
    每日日报8月30日
    每日日报8月29日
    每日日报8月28日
    每日日报8月27日
  • 原文地址:https://www.cnblogs.com/Aeneas/p/5751925.html
Copyright © 2020-2023  润新知