天涯论坛

 找回密码
 立即注册
搜索
查看: 72|回复: 3

CSS基本语法

[复制链接]

3059

主题

155

回帖

9923万

积分

论坛元老

Rank: 8Rank: 8

积分
99238913
发表于 2024-6-30 10:43:04 | 显示全部楼层 |阅读模式

css概念

层叠式样式表,一种来表现HTML的文件样式的计算机语言

功效:静态修饰网页,能够协同各样脚本语言动态地对网页各元素进行格式化

css的构成

层叠式:css中贯穿始终的加载特性

1.层叠性

2.继承性

样式:定义怎样表示HTML元素

1.文字文本

2.背景

3.盒模型

4.浮动

5.定位

6.其他

css代码书写位置

有4种书写方式:内联式、内嵌式、外联式、导入式。

内联式:行内式

书写位置:在HTML标签之上的style属性中书写css样式

所有的css样式属性总体构成标签的style属性的属性值

<div style="width:100px;height:100px;font-size:14px;">1</div>

内联式缺点

1.内联式必要写在标签上,完全脱离html标签

2.css样式代码让标签结构繁重,有害于HTML结构诠释

3.一个内联式css代码,只能给一个标签运用倘若有多个标签有相同的样式,一样的css代码要写多次

很繁琐。

实质工作中不运用内联式编写css代码

内嵌式

书写位置:在HTML文件中,在head标签里面写一个style标签,所有css代码写在style标签内部。

内嵌式特点:

优点:

1.实现了结构和样式的初步分离css负责样式,HTML负责结构

2.多个标签能够利用一段代码设置相同的样式,节省代码量。

缺点:

1.结构和样式并完全分离,代码依然写在HTML文件的 style内部。

2.css样式只能给一个HTML文件运用不可够被多个HTML文件同期运用

3.在HTML中倘若css代码太多,会导致文件头重脚轻。

外联式

书写位置:在一个单独的扩展名为.css的文件中

在css文件中直接书写css规则。

引用:在HTML中head标签内部运用link标签进行引入。

link标签属性

属性名属性值说名rel“stylesheet”引入的外边文件与HTML之间的关系,样式表hrefcss文件路径引入css文件type“text/css”暗示加载时代码根据纯文本形式的css代码加载。H5中能够省略不写

外联式优点:

1.实现了HTML和css完全分离

2.多个HTML文件能够共用一个css文件,便于提取公共css,减少代码量

3.能够实现一个css变化,多个HTML页面同期变化,减少工作量

4.一个HTML文件能够引入多个css文件,能够实现同一个页面中css代码分层

导入式

工作中很少运用导入式

实质应用:

小型案例:能够运用内嵌式css

实质工作、大型网站项目:举荐运用外联式css

css规则

1.css代码在给某个标签设置样式前,必要运用选取器选选中标签

2.css样式的属性,属性名和属性值的键值对写法为k:v;

3.给每一个选取器添加样式属性都必要写在一对大括号{}之内

4.给一个标签添加所有必须的样式,都必须在{}内部一一陈列出来

重视

1.分号, 每条属性后面的分号都必要写,倘若不写会引起后面的所有代码加载错误

2.css中所有属性与属性之间对空格、换行、缩进不敏锐

恰当添加注释,使得css代码清晰易读

/*注释内容*/

代码书写标准

展开格式:研发过程运用,代码可读性强,便于调错。

紧凑格式:上传服务器时运用,减少不必要的空白字符,压缩文件体积,便于传输。

css中的英文能够体积写,不举荐运用大写

空格规范

1.选取器与大括号{}之间保存一个空格

2.冒号后面,属性前面,保存一个空格

文字三属性

颜色color

给文字设置颜色

属性名k:color

属性值v:颜色名、颜色值

颜色名

运用颜色的英文单词进行暗示

颜色单词红色red黑色black橙色orange白色white黄色yellow金色gold绿色green粉色pink青色cyan浅黄色lightyellow蓝色blue黄绿色yellowgreen紫色purple天蓝色skyblue

更加多的颜色名能够经过w3c手册查找

字体font-family

定义元素内文字的字体

属性名k:font-family,字体属于font综合属性的一个单一属性

属性值v:字体名叫作必要包裹在一





上一篇:css格式规范整理
下一篇:前端基本入门二(CSS)
回复

使用道具 举报

3073

主题

3万

回帖

9915万

积分

论坛元老

Rank: 8Rank: 8

积分
99158921
发表于 2024-10-7 22:15:05 | 显示全部楼层
外贸B2B平台有哪些?
回复

使用道具 举报

3130

主题

3万

回帖

9910万

积分

论坛元老

Rank: 8Rank: 8

积分
99108601
发表于 2024-10-8 19:25:40 | 显示全部楼层
外贸论坛是我们的,责任是我们的,荣誉是我们的,成就是我们的,辉煌是我们的。
回复

使用道具 举报

3073

主题

3万

回帖

9913万

积分

论坛元老

Rank: 8Rank: 8

积分
99138940
发表于 2024-10-28 07:33:17 | 显示全部楼层
你的见解独到,让我受益匪浅,非常感谢。
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

站点统计|Archiver|手机版|小黑屋|天涯论坛 ( 非经营性网站 )|网站地图

GMT+8, 2024-11-25 07:06 , Processed in 0.100459 second(s), 22 queries .

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.