首页 话题 小组 问答 好文 用户 我的社区 域名交易 唠叨

[分享]css中常用的规则样式

发布于 2024-11-11 19:10:16
0
17

CSS(层叠样式表)是用于控制网页样式和布局的语言。以下是CSS中常用的规则样式。

/*文本格式*/
color: red; /* 字体颜色 */
font-size: 16px; /* 字体大小 */
font-family: Arial, sans-serif; /* 字体族 */
font-weight: bold; /* 加粗 */
text-align: center; /* 对齐方式 */
text-decoration: underline; /* 下划线 */

/*盒模型*/
width: 300px; /* 盒子宽 */
height: 200px; /* 盒子高 */
padding: 20px; /* 内边距 */
margin: 30px; /* 外边距 */
box-sizing: border-box; /* 边框盒模型(大小包括边框和内边距) */

/*背景*/
background-color: #eee; /* 背景颜色 */
background-image: url("paper.jpg"); /* 背景图片 */
background-repeat: repeat-x; /* 重复方式 */
background-size: cover; /* 大小 */

/*边框*/
border-width: 2px; /* 边框宽度 */
border-style: dotted; /* 边框样式 */
border-color: green; /* 边框颜色 */
border-radius: 10px; /* 圆角 */

/*浮动*/
float: left; /* 向左浮动 */
clear: both; /* 清除浮动 */

/*定位*/
position: absolute; /* 绝对定位 */
top: 100px; /* 顶部距离 */
left: 200px; /* 左侧距离 */

/*鼠标悬停*/
:hover {
    color: blue; /* 字体颜色 */
    background-color: yellow; /* 背景颜色 */
}

/*响应式布局*/
@media screen and (max-width: 768px) {
    /* 在宽度小于768px时应用以下样式 */
    /*...*/
} 

以上是CSS中常用的规则样式,它们可以帮助你设计出优美的网页布局。

评论
一个月内的热帖推荐
91云脑
Lv.1普通用户

62849

帖子

14

小组

291

积分

赞助商广告
站长交流