CSS

最新推荐文章于 2025-02-09 17:48:49 发布

woshijinfeixi

最新推荐文章于 2025-02-09 17:48:49 发布

阅读量193

点赞数

本文链接：https://blog.youkuaiyun.com/woshijinfeixi/article/details/82973088

版权

1.css概念；：
css全拼：cascade style sheet -----级联样式表格
主要作用是控制网页上标签的各种样式：比如颜色，字体，边框，等等
2.css格式
- 行内样式：可以加注在标签上例如：<标签 style="具体的样式"></标签> 缺点是：如果多个标签用一个相同的样式的话，样式的代码会重复
- 内部样式表：定义在<html></html>里面的<head></head>标签里面，具体格式如下

<html>
	<head>
		<style>样式的内容</style>
	</head>
	<body></body>
</html>

内部样式表可以通过标签的class，id等，满足对多个标签使用相同样式的需求。
-外部样式表：把样式的信息定义在一个单独的文件中，文件的类型*.css

<html>
	<head>
		<link rel="样式文件的文件名" href=''css文件的路径">
	</head>
</html>

3.行内样式

颜色控制：颜色值可以是英文单词<标签 style="color:red"></标签>color后可以写任意颜色的单词；也可以是红绿蓝三原色 rgb（255，0，0）根据这三个值的大小来进行配色，三个值的最大值都是255，最小值则是0。建议：如果要用三原色进行配色的话，可以在画图工具里面的调色板来查找你所需要的颜色的三原色的数值；颜色也可以根据十六进制的值进行表示；背景色的控制与颜色控制类似，只不过把color变成background-color。例如：<标签 style="background-color:red"></标签>
字体相关的样式：font-size 像素 n px ；字体本身的大小 n em；font-family 字体的类型：如宋体，隶书，楷体等等；font-style:italic 斜体；font-weight:bold粗体
对齐方式：text-align:center居中，left靠左对齐，right 靠右对齐
背景相关：background-image:url背景图片的路径；background-repeat:控制背景图片如何重复no-repeat不重复 repeat-x在x方向上重复，repeat-y在y方向上重复；background-size: npx控制背景图的大小
div标签：这是一个容器标签可以包含，容纳其他的标签，他的作用是：当需要统一处理标签，或者对页面的布局有一定的要求时，就可以用div标签:
宽高：width:宽度height：高度他们的单位可以是px像素，也可以是n%:所占页面的比例
边框：border-color:边框颜色；border-style:边框为实线，虚线等border-width边框的宽度；他们可以合并为一个border: red solid 100%
文字修饰：text-decoration: 值line-through贯穿线 underline 下划线