css基础样式表

CSS（层叠样式表）是前端开发中重要的一份工具。CSS用于定义HTML文档的外观和格式化。在CSS基础样式表方面，我们有以下内容:

1.选择器

/* 选择所有的p元素 */p {
    color: red;
    font-size: 18px;
    text-align: center;
}
/* 选择class为'info'的元素 */.info {
    border: 1px solid black;
    padding: 10px;
}
/* 选择id为'main'的元素 */#main {
    background-color: lightgray;
    margin: 20px;
}

2. 背景和文本属性

/* 设置文本颜色和背景颜色 */body {
    color: #333;
    background-color: #fff;
}
/* 设置元素边框 */div {
    border: 1px solid black;
    border-radius: 5px;
 /* 设置圆角边框 */}
/* 设置图像的透明度 */img {
    opacity: 0.5;
}

3. 布局和盒子模型

/* 设置元素的宽度和高度 */.box {
    width: 200px;
    height: 200px;
}
/* 设置元素内边距 */.box {
    padding: 20px;
}
/* 设置元素外边距 */.box {
    margin: 20px;
}
/* 让元素在页面的居中位置 */.box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

4. 分类和列表

/* 设置列表项的样式 */li {
    list-style-type: circle;
}
/* 设置表格的样式 */table {
    border-collapse: collapse;
}
/* 设置表格的边框 */td, th {
    border: 1px solid black;
    padding: 10px;
}
    

总结

以上是CSS基础样式表的常见内容。掌握这些内容可以使我们在前端开发中更加自信和高效。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！