CSS样式的三种表现用法

学会了CSS样式的三种表现用法,CSS原来可以如此简单!

操作方法

  • 01

    一.外部样式 将CSS样式编写并安放在一个独立的.css文件内,有<link />和@import两种方式,而@import基本被放弃使用。 <link rel="stylesheet" href="CSS文件路径" /> 实例1: 相对路径:<link rel="stylesheet" href="css.css" /> 绝对路径:<link rel="stylesheet" href="http://www.heavan.net/sytle/css.css" />

  • 02

    二.内部样式 定义在style标签中,放在head标签中,设置的样式可以影响整个HTML页面。 <style> 选择器1 { 属性名称1:属性值1; 属性名称2:属性值2; ...... } 选择器2 { 属性名称a:属性值a; 属性名称b:属性值b; ...... } ...... </style> 实例2: <style> body { background:red; color:blue; } p{ color:red; } ...... </style>

  • 03

    三.内联样式 内联样式,也称行内样式,写在标签内的样式,只影响该标签内的元素。适合范围,除<script>外的所有子标签。 <自定义标签名 style="属性名称1:属性值1;属性名称2:属性值2;......;"> 实例3: <body style="background:blue;color:gold;......;">

  • 04

    小编在这里是手写CSS样式,所以使用txt文本文档来写。如果有Dreamweaver软件,对新手编写CSS样式来说也是一种不错的选择。

  • 05

    打开Dreamweaver软件,新建文档,选择新建CSS,然后点新建。软件自动生成标准CSS样式模版,在里面输入CSS外部样式。

  • 06

    打开Dreamweaver软件,新建HTML文档,一个html文档内可以输入CSS样式的三种表现用法。 作者:刘承元 新浪微博:刘承元VIP 微信公众号:刘承元

(0)

相关推荐

  • 添加CSS样式的3种方式及样式表的优先权

    网页就是一堆[html标签]有序的搭配,让[CSS属性值]整整容,请[Javascript语言]处理一下事件. 那么如何添加样式呢?以及它们的优先级怎么样呢?请看下文. CSS介绍 01 如果说,原生 ...

  • JS设置CSS样式的几种方式

    JS设置CSS样式的几种方式 操作方法 01 1. 直接设置style的属性  某些情况用这个设置 !important值无效,如果属性有'-'号,就写成驼峰的形式(如textAlign)  如果想保 ...

  • photoshop中为图层添加图层样式的三种方法

    photoshop中为图层添加图层样式的三种方法 操作方法 01 用photoshop打开一个图像文件 然后建立一个文字图层 其他什么图层都可以 02 点击导航栏目fx按钮 箭头所指向的 03 点击后 ...

  • 网页设计中有哪5类常用的CSS样式

    操作方法 01 网页设计中常用到CSS样式有哪些?CSS样式能让我们快速实现一些功能,在这里和大家分享,CSS样式的五种方式如何应用在网页设计中,文中我们就详细说到代码的实现,希望对从事网页设计的朋友 ...

  • HTML样式CSS的三种写法

    CSS是样式层叠表,有三种引入方式.下面,我们来看看HTML样式CSS的三种写法吧. 操作方法 01 行内样式 CSS可以直接放到行内样式中引入即可,比如代码如下图: <p style=&quo ...

  • css样式如何设置div元素水平垂直居中的三种方法

    CSS实现绝对定位元素的居中效果,有时候需要把一个元素进行居中,在这里讲解三种方法,各种方法有它的优缺点. 操作方法 01 1.建立txt文档,更改后缀名为html,如图: 02 2.右击html文件 ...

  • CSS样式表内嵌排版样式的用法详解教程

    CSS样式表在网页设计中用处很广泛,设置网页的标签属性.文字属性.文字长度.背景等等都用到了CSS样式表来设计.CSS不仅功能齐全而且便于修改和阅读.在这里我就来介绍下用内嵌的方式创建CSS类.id和 ...

  • Java开发中的break的三种用法

    在Java开发中,有那么几个关键词非常常用,如:return.continue.break:其实它们本身含义不大,英文解释一句话的事情,但是当它们依附循环或者switch语句时,就变得复杂而有意思了. ...

  • photoshop中图层样式中颜色叠加的三种混合模式

    photoshop中图层样式中颜色叠加的三种混合模式 操作方法 01 选中上层图层 点击添加图层样式按钮 然后点颜色叠加 02 混合模式设置为正片叠底 选择一种颜色 调整不透明度 03 点击确定后效果 ...