• css简介和属性


    CSS指的是层叠样式表(Cascading Style Sheets)

    样式定义如何显示HTML元素,通常存储在样式表中。

    css使用方式

    内联式

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>内联样式</title>
    </head>
    <body>
        <p style="background: red"> I  love  China!</p>
    </body>
    </html>

    内部样式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>内联样式</title> <style type="text/css"> p{ background: green; } </style> </head> <body> <p> I love China!</p> </body> </html>

    外部样式

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>内联样式</title>
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <p> I  love  China!</p>
    </body>
    </html>

    CSS语法:

    selector {property : value;}  选择器{属性1:值1;属性2:值2;}

    常用选择器: 

    • .ClassSelector(类)
    • #IdSelector(id)
    • Selector(标签)

    基本CSS属性: 背景,文本,字体,尺寸,边距和填充,边框

    background (背景)

    • background-color  背景颜色
    • background-image 背景图像
    • background-repeat  背景平铺方式或重复
    • background-attachment  背景图像是否固定或随平面滚动
    • background-position  背景图像起始位置

    Text(文本)

    • color  颜色
    • line-height  行高
    • text-align  文本水平对齐方式
    • vertical-align  文本垂直对齐方式
    • Text-indent  首行缩进
    • Text-shadow  字体阴影
    • White-space  空白处理方式
    • Word-spacing  字间距

    Font

    • Font-family   指定文本字体系列
    • Font-size   指定文本字体大小
    • Font-style  指定文本字体样式
    • Font-weight  指定字体粗细

    Dimension

    • height  设置元素高度
    • Line-height  行高
    • max-height 元素最大高度
    • max-width  元素最大宽度
    • min-heigth  元素最小高度
    • min-winth  元素最小宽度
    • width 设置元素宽度

    Margin&Padding

    Margin

    • Margin-top 上边距
    • Margin-bottom   下边距
    • Margin-left  左边距
    • Margin-right  右边距

    Padding

    • Padding-yop  上填充
    • Padding-bottom  下填充
    • Padding-left  左填充
    • Padding-right 右填充

    Border

    • Border-top  上边框
    • Border-bottom  下边框
    • Border-left  左边框
    • Border-right  右边框
    • Border-style  边框样式
    • Border-width  边框宽度
    • Border-color  边框颜色
  • 相关阅读:
    SpringCloud入门须知
    24SQL FOREIGN KEY 约束
    23SQL PRIMARY KEY 约束
    python之一列表集合转为字典
    DesktopSwitcher 开发
    Distribute the App on the Website
    Apple Developer账号申请
    后端——框架——视图层框架——spring mvc——注解
    后端——框架——视图层框架——spring mvc——数据(校验,转换,格式化)
    后端——框架——视图层框架——spring mvc——ExceptionResolver
  • 原文地址:https://www.cnblogs.com/ihacker/p/11067181.html
Copyright © 2020-2023  润新知