zoukankan      html  css  js  c++  java
  • css介绍和三种引入方式

    块标签 >>>>  块元素  在页面上独占一行的标签

    行内标签 >>>> 行内元素 在页面上不会独占一行的标签

    span  行内标签  一般用于在网页上划定一个范围 一般结合CSS样式 帮助我们确定某些现实效果的作用范围

    div    块标签   一般用于做网页的布局

    CSS的引入方式

    <!DOCTYPE html>

    <html>

    <head>

    <meta charset="UTF-8">

    <title></title>

    <!--链接式-->

    <link  rel="stylesheet" href="css/mycss.css" />

    <!--内嵌式-->

    <style>

    /* 选择器 */

    span{

    font-size: 20px;

    color: green;

    font-family: "微软雅黑";

    }

    </style>

    </head>

    <body>

    <!--

    1行内式引入

    借助标签的style属性引入

    style属性中的值语法为  样式名:样式值; 样式名:样式值;... ...

    2内嵌式

    css样式的代码抽取出来,通过选择器确定样式作用范围

    head标签中  使用一对style标签 定义css样式

    style标签中 注释写法  /*   */

    减少相同代码的编写量  减少代码的维护工作量

    3链接式

    行内式只能将样式作用于当前标签

    内嵌式可以将样式作用于多个标签不能作用于其他网页

    链接式可以将样式的作用范围扩大多个不同网页

    链接式可以将CSS代码放入独立的.css文件中 可以使当前页面更加简洁

    每一个需要引入样式 的HTML head标签中使用 link标签引入css文件即可

    4当三种引入方式同时作用于同一个标签 如果样式有冲突 谁的优先级更高

    优先级原则 就近原则

    -->

    <span style="font-size: 40px; color: blue; ">

    欢迎来到

    </span>

    <br />

    <span >

    欢迎来到

    </span>

    <br />

    <span >

    欢迎来到

    </span>

    <br />

    <span >

    欢迎来到

    </span>

    <br />

    <span >

    欢迎来到

    </span>

    </body>

    </html>

    CSS 外部样式文件

     

  • 相关阅读:
    Java(二)
    JS === 关于getElementsByClassName()
    JS === 简易放大镜
    JS === 拖拽盒子
    JS === 实现多个光标跟随事件
    JS === 实现回到顶部
    JS === 实现通过点击td 跳转相应的图片
    final、static关键字
    java面向对象——构造方法
    java面向对象——多态
  • 原文地址:https://www.cnblogs.com/vincentmax/p/14270651.html
Copyright © 2011-2022 走看看