html中 一条样式规则,css规则的基本格式是什么?

CSS(Cascading Styel Sheet)是控制 Web 页面外观的一系列格式设置规则,是网页设计必不可少的工具之一。下面我们就开始学习css的基本语法格式。

f31f5976bea2e1ca34b85aff28e1c996.png

css规则的基本格式是什么?

层叠样式表是一个完全的纯文本文件,通常以“css”为扩展名作为单独的文件来使用,它的内容包含了一组告诉浏览器,如何安排与显示特定的html标签中内容的规则,CSS定义规则由三个部分构成:选择符,属性和属性的取值。语法如下:

语法:selector { property: value }

//选择符 { 属性: 值 }

说明:

1、选择符

选择符是要定义样式的html标记,将html标记作为选择符定义后,则在html页面中该标记下的内容,会按照CSS定义的规则发生改变。

2、属性

CSS属性指的是在选择符中要改变的内容,常见的有:字体属性,颜色属性,文本属性等。下面就是我们定义的一个样式表。@charset"gb2312";

body {

font-family: "宋体";  font-size: 20px;  color: #FF0000;

}

p {

font-family: "宋体";  font-size: 30px;  color: #FF00ff;

}

在这个样式表中:

@charset"gb2312";表示使用中文国标字符集。

body 和 p 是 html 中的两个标签,对这两个标签设置了三种样式,即:font-family: 指定字体的字型。

font-size: 指定字体的大小。

color: 指定字体的颜色。

上面我们定义了一个样式表,下一步的任务是如何把这个样式表和html文件相关联,使html文件按照我们定义的样式显示出来,与html文件相关联的方法有四种,下面我们分别叙述。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/431704.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

css transtion不生效_CSS中transition属性不起作用的原因及解决方法

CSS中的transition属性可用于调整元素更改的时间,它可以像动画一样显示。虽然transition属性可以很方便的实现过渡效果,但是有时候可能会出现无效的情况,所以我们就需要来理解transition属性的写法规则。我们先来看一下CSS中transition属性不…

三白话经典算法系列 Shell排序实现

山是包插入的精髓排序排序,这种方法,也被称为窄增量排序。因为DL.Shell至1959提出命名。该方法的基本思想是:先将整个待排元素序列切割成若干个子序列(由相隔某个“增量”的元素组成的)分别进行直接插入排序…

python清空列表_Python之列表

Python变量没有数据类型,所以Python没有数组。整数;浮点数;字符串;对象创建一个列表:1.member[大鱼,123,3.14,[1,2,3]]2.empty[]向列表添加元素:append():member[大鱼,12…

java切面1.6需要的包_Java技术 AspectJ

AspectJ1 简介AspectJ:Java社区里最完整最流行的AOP框架。在Spring2.0以上版本中,可以使用基于AspectJ注解或基于XML配置的AOP。2 在Spring中启用AspectJ注解支持导入JAR包springsource.net.sf.cglib-2.2.0.jarspringsource.org.aopalliance-1.0.0.jarsp…

华为什么时候更新鸿蒙os,华为鸿蒙系统升级时间表

华为鸿蒙系统升级时间表6月2日HUAWEI Mate 40 ProHUAWEI P40 ProHUAWEI Mate 40 ProHUAWEI Mate 30 ProHUAWEI Mate 40 RS保时捷设计HUAWEI Mate 30 Pro 5GHUAWEI Mate 40HUAWEI Mate 30E Pro 5GHUAWEI Mate 40EHUAWEI Mate 30 RS保时捷设计HUAWEI Mate 2HUAWEI Mate 30HUAWEI …

vsftpd安装问题汇总(持续更新。。)

问题1. 在执行make命令时却出现了问题,具体如下: sysdeputil.o: In function vsf_sysdep_check_auth: sysdeputil.c:(.text0x109): undefined reference to crypt sysdeputil.c:(.text0x13a): undefined reference to crypt collect2: ld 返回 1 make: *…

python游戏程序编码_python实现的生成随机迷宫算法核心代码分享(含游戏完整代码)...

最近研究了下迷宫的生成算法,然后做了个简单的在线迷宫游戏。游戏地址和对应的开源项目地址可以通过上面的链接找到。开源项目中没有包含服务端的代码,因为服务端的代码实在太简单了。下面将简单的介绍下随机迷宫的生成算法。一旦理解后你会发现这个算法…

cesium等高线_Cesium专栏-气象站点色斑图、等值线图(不提供源码)

Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品。它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精度,渲染质量以及多平台,易用性上都有高质…

为什么OC语言很难

作为一个Objective-C的coder,我总能听到一部分人在这门语言上抱怨有很多问题。他们总在想快速学习这门语言来写一个App出来,但他们也总是联想到Objective-C看上去实在太难了或者在想这些语法符号都是神马玩意?不错,他们问得非常好…

小狐狸ChatGPT付费创作系统小程序端开发工具提示打开显示无法打开页面解决办法

最新版2.6.7版下载:https://download.csdn.net/download/mo3408/88656497 很多会员在上传小程序前端时经常出现首页无法打开的情况,错误提示无法打开该页面,不支持打开,这种问题其实就是权限问题,页面是通过调用web-v…

http status 404 – 未找到_从零开始搭建自己的网站004添加404处理页面

在将web-war上传到服务器并重启tomcat后,发现找不到login页面目录结构:add exception do wth page2.添加页面内容;到w404.jsp异常处理,404首页 Home (current) Link Dropdown Action Another action Disabled Search 百度百科&am…

dw怎么打开html模板,Dreamweaver中如何使用模板

随着Internet的普及,很多人已经不满足于仅仅上网冲浪,而希望深入地参与其中。现在,拥有自己的Web网站已经成为一种潮流。虽然制作一个简单的网页并不困难,但是制作出超凡脱俗的网站就不那么容易了。下面是小编为大家带来的关于Dre…

云计算的认识和看法_云存储已经成为存储的未来,你的存储跟上节奏了吗?

云计算是目前业界最关注的话题,其实云计算让很多人云里雾里。而云存储则是存储的未来。云存储这个概念的出现,在一定程度上改变了我们对于传统存储模式的看法。但是云存储想必让很多人迷惑,今天我们就来聊聊云存储的那些事儿。对于一些计算机…

coco2dx c++ HTTP实现

coco2dx c HTTP实现 达到的结果如下面的 iPhone截图 android 日志截图 流程图例如以下 功能主要通过CURL c pthread 实现 我实现的不是多线程断点(假设要实现能够依据我这个进行加入任务序列,可參考 cocos2d-x 中AssetsManager的实现,事实上…

计算机动画 应用,计算机动画与应用.PDF

计算机动画与应用.PDF三维计算机动画金小刚Email: jin浙江大学CAD&CG 国家重点实验室紫金港校区蒙民伟楼512Course web: /home/jin/animation.htmXiaogang Jin 1 2/28/2017ModelingRenderingAnimation计算机图形 User Interface虚拟世界Xiaogang Jin 2 2/28/2017Pixar片头X…

idea怎么使用断点调试js_idea怎么使用断点调试js

{"moduleinfo":{"card_count":[{"count_phone":1,"count":1}],"search_count":[{"count_phone":10,"count":10}]},"card":[{"des":"刷脸门禁通行系统前端接入人脸AI赋能的人脸…

常量池在堆还是方法区_第九章_方法区

方法区栈、堆、方法区的交互关系这次所讲述的是运行时数据区的最后一个部分——方法区从线程共享与否的角度来看ThreadLocal:如何保证多个线程在并发环境下的安全性?典型应用就是数据库连接管理,以及会话管理栈、堆、方法区的交互关系下面就涉…

html5表单密码验证及提示,HTML5表单及其验证(示例代码)

1.输入型控件Input type用途说明email电子邮件地址文本框url网页URL文本框number数值的输入域属性 值 描述max number 规定允许的最大值min number 规定允许的最小值step number 规定合法的数字间隔(如果 step"3",则合法的数是 -3,0,3,6 等)value number …

3.6.4python下载安装教程_python 3.6.4安装教程

{"moduleinfo":{"card_count":[{"count_phone":1,"count":1}],"search_count":[{"count_phone":4,"count":4}]},"card":[{"des":"阿里技术人对外发布原创技术内容的最大平台&…

CTabCtrl控件标签的相关设置

原文链接: http://blog.csdn.net/happyhell/article/details/6012177 1、 获得CTabCtrl标签高度:CRect rc; CTabCtrl *pTabCtrl GetTabControl(); pTabCtrl->GetItemRect(&rc); int nHeight rc.Height(); 2、修改CTabCtrl标签上的文字: // In t…