首页 > 其他分享 >css学习笔记

css学习笔记

时间:2023-12-13 21:23:53浏览次数:28  
标签:网页 样式 元素 笔记 学习 css 选择器 CSS 属性

CSS(层叠样式表)是一种用于描述网页样式和布局的语言。它使得我们可以通过选择器和属性来控制网页的外观。以下是一些CSS的基本概念:

  1. 选择器:选择器用于选择要应用样式的元素。常见的选择器有标签选择器(如 ph1)、类选择器(如 .class-name)和ID选择器(如 #id-name)等。选择器的选择范围可以更广泛,通过组合使用多个选择器来选择不同元素。

  2. 属性:属性用于定义元素的样式。常见的CSS属性包括 color(颜色)、font-size(字体大小)、background-color(背景颜色)等。每个属性有相应的值,如 color: red,表示将文字颜色设置为红色。

  3. 盒模型:盒模型是CSS布局的基础。每个元素被视为一个矩形的盒子,包含内容、内边距、边框和外边距四个部分。通过设置盒子的宽度、高度和边距等属性,可以控制元素在页面中的布局。

  4. 运算符和单位:CSS中的运算符(如 +-*/)可以用于计算属性的值。常见的单位包括像素(px)、百分比(%)、em(基于元素字体尺寸的单位)等。

  5. 媒体查询:媒体查询允许根据设备的特性(如屏幕尺寸、分辨率等)来适配不同的样式。通过媒体查询,可以创建响应式的网页布局,使网页在不同的设备上呈现良好的效果。

  6. 伪类和伪元素:伪类和伪元素允许为元素的特定状态或位置选择样式。例如,:hover 伪类可以在鼠标悬停在元素上时改变其样式,::before 伪元素可以在元素前插入内容。

标签:网页,样式,元素,笔记,学习,css,选择器,CSS,属性
From: https://www.cnblogs.com/heweiye/p/17899951.html

相关文章

  • 分布式学习记录:第4天
       在分布式学习的探索之旅中,第四天我深入了解了分布式学习的并行计算和负载均衡技术。首先,我学习了分布式学习的并行计算技术。并行计算是分布式学习的重要手段之一,它可以通过将计算任务分配给多个计算节点,同时进行计算,以加速模型的训练过程。我学习了不同的并行计算方法,如数......
  • python学习笔记1(你好,python)
    虽然一直不会python,但也了解一些python的场景,比如爬取数据、数据挖掘、ai,今天开始从B站上系统学习一下今日学习笔记:1、python优点:易于读写和学习,英文描述方式专注于解决问题,代码少、有生产力易调试,解释型语言,只显示第一个错误开源免费,标准库很强大,社区也很强大2、缺点:内存占用率高,......
  • centos7 搭建 open vpn新笔记
    刚好这段时间需要用到openvpn,搭建起来也是遇到很多问题,所以在这里记录一下。openvpn:OpenVPN是受欢迎的开源虚拟专用网络的软件包之一,它是一个全功能的SSL虚拟专用网络。它使用行业标准SSL/TLS协议实现OSI第2层或第3层安全网络扩展,支持基于证书、智能卡、用户名密码等多种的客户端身......
  • SM4算法学习
    简介SM4算法是我国商用密码标准,其前身是SMS4算法。SM4算法是一个分组加密算法,分组长度和密钥长度均128bit。SM4算法使用32轮的非线性迭代结构。SM4在最后一轮非线性迭代之后加上了一个反序变换,因此SM4中只要解密密钥是加密密钥的逆序,它的解密算法与加密算法就可以保持一致。SM4......
  • 基于AlexNet深度学习网络的智能垃圾分类系统matlab仿真
    1.算法运行效果图预览  2.算法运行软件版本matlab2022a 3.算法理论概述       基于AlexNet深度学习网络的智能垃圾分类系统是一种利用深度学习技术,对垃圾图像进行分类的系统。下面将详细介绍这种系统的原理和数学公式。 3.1、基于AlexNet深度学习网络的......
  • Rong晔大佬教程学习(3):取译码
    在讲解指令译码之前,我们首先需要了解指令,如下图所示,ARM、MIPS、RISCV-v指令集同属于RISC指令集(精简指令集),特别注意的是,相同的一条指令在不同的ISA中译码得到的结果是不同的,这也很好理解,比如“nihao”在拼音中可以翻译为“你好”,就是打招呼的意思,但在英文中这甚至不是一个单词......
  • openGauss学习笔记-156 openGauss 数据库运维-备份与恢复-导出数据-使用gs_dump和gs_d
    openGauss学习笔记-156openGauss数据库运维-备份与恢复-导出数据-使用gs_dump和gs_dumpall命令导出数据-导出单个数据库-导出数据库156.1导出数据库openGauss支持使用gs_dump工具导出某个数据库级的内容,包含数据库的数据和所有对象定义。可根据需要自定义导出如下信息:导出......
  • openGauss学习笔记-157 openGauss 数据库运维-备份与恢复-导出数据-使用gs_dump和gs_d
    openGauss学习笔记-157openGauss数据库运维-备份与恢复-导出数据-使用gs_dump和gs_dumpall命令导出数据-导出单个数据库-导出模式157.1导出模式openGauss目前支持使用gs_dump工具导出模式级的内容,包含模式的数据和定义。用户可通过灵活的自定义方式导出模式内容,不仅支持选定一......
  • Jmeter性能测试学习笔记
    转自https://www.cnblogs.com/yoyoma0355/p/14658807.htmljmeter定时器:https://blog.csdn.net/u013258415/article/details/78321288 性能测试的概念和公式:https://www.cnblogs.com/April-Chou-HelloWorld/p/8780384.html 压力测试:https://blog.csdn.net/weixin_52295158/a......
  • css实现元素四周阴影
    首先确定的是需要使用box-shadow这一属性语法如下:box-shadow:h-shadowv-shadowblurspreadcolorinset;h-shadow:表示水平方向上的阴影偏移量,必须指明,可以是正数、负数、0,如果为正数左方有阴影,如果为负数右方有阴影,如果为0它位于元素的正中间。v-shadow:表示垂直方向上的阴影偏移......