一些css示例代码

  1. 设置文本样式:


css复制代码

p {
font-family: Arial, sans-serif;
font-size: 16px;
color: #333;
line-height: 1.5;
text-align: justify;
}
  1. 设置背景样式:


css复制代码

body {
background-color: #f2f2f2;
background-image: url('background.jpg');
background-position: center;
background-repeat: no-repeat;
}
  1. 设置边框样式:


css复制代码

div {
border-style: solid;
border-width: 1px;
border-color: #ccc;
}
  1. 设置边距和填充样式:


css复制代码

div {
margin: 10px;
padding: 20px;
}
  1. 设置盒模型样式:


css复制代码

div {
width: 200px;
height: 100px;
border: 1px solid #ccc;
padding: 20px;
margin: 10px;
}
  1. 设置定位和显示样式:


css复制代码

div {
position: absolute;
top: 50px;
left: 50px;
display: block;
}
  1. 设置动画和过渡样式:


css复制代码

@keyframes example {
0% {background-color: red;}
50% {background-color: blue;}
100% {background-color: green;}
}
div {
width: 100px;
height: 100px;
background-color: red;
animation-name: example;
animation-duration: 4s;
}

你可能感兴趣的:(css,前端)