首页 > 其他分享 >CSS详解

CSS详解

时间:2023-03-23 18:24:22浏览次数:36  
标签:网页 样式 标题 color 详解 选择器 CSS

Cascading Style Sheets层叠样式表
HTML+CSS+JavaScript
框架+表现+交互

一、初始及入门

1.CSS概念

CSS在网页中的应用
CSS的发展史
CSS的优势

2.CSS基本语法

标签style

3.三种引入方式

行内样式
内部样式
外包样式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        h1{
            color:red;
        }
    </style>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
<h1>标题1</h1>
<h2>标题2</h2>
<h3 style="color:blue">标题3</h3>
<h4>标题4</h4>
</body>
</html>

4.CSS选择器(重点)

基本选择器:标签 id# class.
高级选择器:
层次选择器(空格 > ~ +)
结构伪类选择器child
属性选择器a[可以正则]

二、美化网页

字体:color、font-siza
排版网页:
超链接伪类:
列表样式:
背景样式:

三、盒子模型

四、浮动

五、定位

标签:网页,样式,标题,color,详解,选择器,CSS
From: https://www.cnblogs.com/liweixiao/p/17244169.html

相关文章

  • ESD二极管工作原理、封装、型号、选型(详解)
    常用静电防护保护器件——ESD二极管,对于电子工程师而言,并不陌生。在消费电子、家电、智能家居、可穿戴智能设备、汽车电子、安防、工业设备等产品领域中都能看到ESD二极管靓......
  • Mysql常用语法详解
    一、数据库创建数据库createdatabase数据库名;查询所有数据库showdatabases;查看正在创建的数据库信息showcreatedatabase数据库名;删除数据库dropdatabas......
  • css画90度箭头|大于号|小于号
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"/><metaname="viewport"content="width=device-width,initial-scale=1.0"/><title>c......
  • css画对钩|钩子
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"/><metaname="viewport"content="width=device-width,initial-scale=1.0"/><title>c......
  • SpringBoot详解
    一、介绍1.SpringBoot是一个基于Spring框架的开源框架,用于构建微服务和Web应用程序。它可以帮助开发者轻松创建独立的、基于Spring的应用程序,并在较短的时间内完......
  • 虚拟内存与malloc/new原理详解
    mallocmalloc()函数并不是系统调用,而是C库里的函数,用于动态分配内存。malloc()分配的是虚拟内存,而不是物理内存。如果分配后的虚拟内存没有被访问的话,是不会将虚拟内存......
  • css中的&是什么意思
    这个是scss中的语法,表示上一级的选择器例如源码:ul{margin-bottom:20px;&>li{margin-bottom:0;}}相当于代码ul{margi......
  • css属性——env()和constant()设置安全区域,解决移动端小程序和H5底部栏 iPhoneX安全
    转载:https://www.cnblogs.com/jiaoshou/p/16647577.html使用苹果官方推出适配方案css函数env()、constant()来适配苹果官方推荐使用env(),constant()来适配,建议使用该方......
  • CSS伪类
    CSS伪类是用来添加一些选择器的特殊效果。语法伪类的语法:selector:pseudo-class{property:value;}CSS类也可以使用伪类:selector.class:pseudo-class{property:v......
  • CSS 实现重叠效果时,div 背景被 img 图片遮挡
    CSS为实现重叠效果,将margin-top设为负值时,div背景被img图片遮挡一、未实现重叠效果<body><imgsrc="https://cdn.uviewui.com/uview/swiper/swiper2.png"......