什么是CSS语法?详细介绍使用方法及规则插图

一、css语法

CSS 规则集(rule-set)由选择器和声明块组成

微信截图_20210708103218.jpg

例子解释

p是 CSS 中的选择器(它指向要设置样式的 HTML 元素:<p>

color 是属性,red 是属性值

text-align 是属性,center 是属性值

代码示例:

<html>
<head>
<style>
p
{
	color:red;
	text-align:center;
} 
</style>
</head>
<body>
<p>php</p>
<p>亿码酷站</p>
</body>
</html>

效果图:

微信截图_20210708151330.jpg

CSS 实例:

CSS声明总是以分号(;)结束,声明总以大括号({})括起来:

p 
{ 
color:red; 
text-align:center; 
}

注释是用来解释你的代码,并且可以随意编辑它,浏览器会忽略它。

CSS注释以 /* 开始, 以 */ 结束, 实例如下:

/*这是个注释*/ 
p 
{ 
text-align:center; 
/*这是另一个注释*/ 
color:black; 
font-family:arial; 
}

二、CSS如何使用方法?

CSS使用方法:编辑工具

任何文本编辑工具样式表使用方法一般有三种:

1)文档头部插入:适用于单个网页应用

2)行内插入:适用于页面中一、两个地方才用到CSS

3)外部链接样式文件:适用于多个网页都用到CSS

在HTML网页中css的不同使用方法调用css的方法不同

1、头部插入样式

<style type="text/css">……</style>

代码示例:

<html>
<head>
<title>中文网(php.com)</title>
<style type="text/css">
body {background-color:yellow;}
h1   {font-size:36pt;}
h2   {color:blue;}
p    {margin-left:50px;}
</style>
</head>
<body>

注:这里将style对象的type属性设置为”text/css”是不支持这类型的浏览器忽略样式表单。

2、行内插入样式

<p style=“font-size:16pt;color:blue”>蓝色16号文字</p>

采用<style="font-size:16pt;color:blue">的格式把样式写在html中的任意行内,这样比较方便灵活。

3、外部链接样式

先建立外部样式表文件(.css),然后使用HTML的link对象

<head>
<title>中文网(php.com)</title>
<link rel=stylesheet
href="http://www.ymkuzhan.com/php.cn"
type="text/css">
</head>

这种方法非常适宜同时定义多个文档。它能使多个文档同时使用相同的样式,从而减少了大量的冗余代码。

而在XML中,你应该如下例所示在声明区中加入:

<? xml-stylesheet type="text/css" href="http://www.ymkuzhan.com/php.css" ?>

定义内部样式块对象 (Embedding a Style Block)

你可以在你的HTML文档的<HTML>和<BODY>标记之间插入一个<STYLE>…</STYLE>块对象。 定义方式请参阅样式表语法。

示例如下

注意事项

  • 注意要细心

推荐学习:CSS视频教程

以上就是什么是CSS语法?详细介绍使用方法及规则的详细内容,更多请关注亿码酷站其它相关文章!



什么是CSS语法?详细介绍使用方法及规则
—–文章转载自PHP中文网如有侵权请联系ymkuzhan@126.com删除

下载声明:
  • 本站资源如无特殊说明默认解压密码为www.ymkuzhan.com建议使用WinRAR解压;
  • 本站资源来源于用户分享、互换、购买以及网络收集等渠道,本站不提供任何技术服务及有偿服务,资源仅提供给大家学习研究请勿作它用。
  • 赞助本站仅为维持服务器日常运行并非购买程序及源码费用因此不提供任何技术支持,如果你喜欢该程序,请购买正版!
  • 版权声明:
  • 下载本站资源学习研究的默认同意本站【版权声明】若本站提供的资源侵犯到你的权益,请提交版权证明文件至邮箱ymkuzhan#126.com(将#替换为@)站长将会在三个工作日内为您删除。
  • 免责声明:
  • 您好,本站所有资源(包括但不限于:源码、素材、工具、字体、图像、模板等)均为用户分享、互换、购买以及网络收集而来,并未取得原始权利人授权,因此禁止一切商用行为,仅可用于个人研究学习使用。请务必于下载后24小时内彻底删除,一切因下载人使用所引起的法律相关责任,包括但不限于:侵权,索赔,法律责任,刑事责任等相关责任,全部由下载人/使用人,全部承担。以上说明,一经发布视为您已全部阅读,理解、同意以上内容,如对以上内容持有异议,请勿下载,谢谢配合!支持正版,人人有责,如不慎对您的合法权益构成侵犯,请联系我们对相应内容进行删除,谢谢!