zoukankan      html  css  js  c++  java
  • css的引入方法

    1.外部途径:

    建立xx.css文件与html文件放在同一目录下

    加入  <link rel="stylesheet" type="text/css" href="4.css"/>
    <!DOCTYPE html>
    <html>
      <head>
        <meta name="generator"
        content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
        <meta charset="utf-8" />
        <title>CSS样式</title>
        <meta name="keywords" content="用css给网页装潢" />
        <meta name="description" content="用css给网页装潢" />
        <link rel="stylesheet" type="text/css" href="4.css"/>
      </head>
      <body>
        <p>段落</p>
        <p>段落</p>
        <p>段落</p>
        <p>段落</p>
      </body>
    </html>
    p{
        font-size:40px;
        color:red;
    }

    2.内页样式:直接写到html的头部分

    <style type="text/css">
            p{
            font-size:40px;
            color:red;      
              }
    </style>
    <!DOCTYPE html>
    <html>
      <head>
        <meta name="generator"
        content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
        <meta charset="utf-8" />
        <title>CSS样式</title>
        <meta name="keywords" content="用css给网页装潢" />
        <meta name="description" content="用css给网页装潢" />
        <style type="text/css">
            p{
            font-size:40px;
            color:red;      
              }
    </style>
        <!--   <link rel="stylesheet" type="text/css" href="4.css"/>-->
      </head>
      <body>
        <p>段落</p>
        <p>段落</p>
        <p>段落</p>
        <p>段落</p>
      </body>
    </html>

    3.行内样式

    <!DOCTYPE html>
    <html>
      <head>
        <meta name="generator"
        content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
        <meta charset="utf-8" />
        <title>CSS样式</title>
        <meta name="keywords" content="用css给网页装潢" />
        <meta name="description" content="用css给网页装潢" />
      </head>
      <body>
        <p style=" font-size:40px; color:red;">段落</p>
        <p>段落</p>
        <p>段落</p>
        <p>段落</p>
      </body>
    </html>

    CSS 基本语法(语法简单的理解就是规则)
    1)CSS 规则由两个主要的部分构成:
    1、选择器
    2、一条或多条声明。
    选择器:要给元素装潢加样式(首先得选中需要装潢的元素)
    声明:声明由一个属性和一个值组成
    属性是您希望设置的样式属性。每个属性有一个值。属性和值被冒号分开,如果
    要定义不止一个声明,则需要用分号将每个声明分开,养成良好的习惯,就算一
    个声明我们也加上分号。
    选择器{属性:值;}
    使用空格以及回车让css 更可读!
    选择器{
    属性:值;
    }
    2)小试牛刀
    选择器有一种最简单的写法直接写上你要选中的元素!
    p {
    color:red; 该行声明将颜色设置为红色
    font-size:30px; 该行声明将字体大小设置为30px
    }
    查看效果!
    3)CSS 加注释
    /*注释的内容*/

        <style type="text/css">
            p{
            font-size:40px;
            color:red;      
              }/*css的注释*/ 
    </style>
  • 相关阅读:
    IPAD3终于发布了!苹果在5年内还是很难被超越!
    今天更新了ubuntu11.10!
    折腾两日系统重装,对比ubuntu11.04 和windows 7旗舰版!(不定时更新添加新的体验)
    DELL XPS M1530安装MAC OS X Lion 10.7.3经验分享!
    ubuntu 11.04 指纹识别的安装!
    Dlink DIR615L 和水星(mercury) MW300R桥接方法!
    POJ 3522 Slim Span(kruskal 变型)
    POJ 3621 Sightseeing Cows(SPFA + 构造负环)
    POJ 2553 The Bottom of a Graph(Tarjan)
    POJ 2728 Desert King(最优比率生成树)
  • 原文地址:https://www.cnblogs.com/Yimi/p/5865474.html
Copyright © 2011-2022 走看看