CSS学习——flex布局
学习内容来源：CSS Flexbox
父元素（flex 容器）
flex 布局中必须有一个 display 属性设置为 flex 的父元素。即上图中蓝色区域为父元素，也称作 flex 容器，数字1、2、3所在的 div 被称作 flex 项目。
// html代码
<div class="flex-container">
<div>1</div>
<div>2</div>
<div>3</div>
</div>
// css代码
<styl ...
CSS学习笔记
CSS
1、 什么是CSS
Cascading Style Sheet(层叠/级联样式表)
层叠：多个样式可以作用在同一个html的元素上，同时生效
2、作用
表现层,美化网页
内容
字体
颜色
边距
宽高
背景图片
网页浮动
...
3、优势
内容和表现分离
网页结构表现统一,可以实现复用
样式十分丰富
建议使用独立于html的css文件
利用SEO, 容易被搜 ...
【css】css语法学习笔记
学习网站 以下内容均摘抄自该网站
CSS 介绍
CSS 指层叠样式表 (Cascading Style Sheets)，样式定义如何显示 HTML 元素。
CSS 语法
CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。
选择器通常是您需要改变样式的 HTML 元素。
每条声明由一个属性和一个值组成。
CSS注释以 /* 开始, 以 */ 结束。
/* 选择器 { ...
CSS学习
文章目录
1、初识CSS31.1、什么是CSS1.2、CSS的发展史1.3、CSS的基本语法1.4、引入CSS方式1.5、CSS基本选择器1.6、CSS高级选择器1、层次选择器2、结构伪类选择器3、属性选择器
1.7、小结
2、美化网页元素2.1、为什么使用CSS2.2、字体样 ...
HTML+CSS学习02
今天是学习HTML+CSS的第二天，学习的途径仍然是b站上的黑马程序员，以下是今日笔记：
9.文本格式化标签 加粗文字：<strong></strong>或者<b></b> 倾斜文字：<em></em>或者<i></i> 删除线：<del></del>或者<s></s> 下划线：<ins></ins>或者<u></u>
10.<div>和<span>标签（都是用来布局的） <div>和<span>标签是没有语义的， ...
CSS – W3Schools 学习笔记 (1)
CSS Color
Link to W3Schools
这里讲的是 color 的 value, 它可以用在许多属性上, 比如 background-color, color, border-color 等等
color 值有许多写法, RGB, HSL, HEX, ColorName
通过 VS Code 我们可以任意切换. 它们是等价的
开发中一般使用 HSL, 因为它比较容易理解和控制.
教程一般时候, ColorName, RG ...
css学习
第一个css程序
项目结构：
html文件
<meta charset="UTF-8">
<title>Title</title>
<!--<style> 可以编写css的代码
语法：
选择器{
声明1;
声明2;
声明3;
.....
}
link ： 引入css文件
相当于：
<style>
...
Css学习笔记
浮动
传统网页的三种布局方式
标准流(普通流/文档流)
浮动
定位
比如说下面这个，使用标准流很难做(一个在左边，一个在右边)：
又比如说，下面鼠标滚动的时候，圈中的盒子是固定的，使用标准流也很难做：
flex布局
传统布局与flex布局的比较
flex布局体验
<head>
<meta charset="UTF-8">
<meta name="vi ...
CSS学习笔记：flex布局
目录一、Flex布局简介1. Flex布局的主要作用2. Flex布局应用场景二、Flex布局的使用1. Flex布局的两种相关元素2. 父项属性2.1 flex- direction2.2 justify-content2.3 flex-wrap2.4 align-items2.5 align-content2.6 flex-flow3. 子项属性3.1 flex3.2 align-self3.3 order
参考资料：https://www.bilibili.com/video/BV1N54 ...
CSS学习笔记：display属性
目录一、display属性概述1. 块级元素和行内元素的区别2.常见的块级元素和行内元素3. display属性常见的属性值二、测试display取各属性值的效果1. 测试inline和block2. inline-block属性值3. table-cell属性值4. none属性值
参考资料：https://www.bilibili.com/video/BV18J411S7tZ?p=5
一、display属性概述
根据CSS规范的规 ...
CSS 基础 学习笔记（2021.10.22~24）
CSS
目录CSS一、CSS的简单介绍二、什么是CSS和发展史三、CSS的快速入门及优势四、四种css导入方式五、三种基本选择器-重要六、层次选择器七、结构伪类选择器八、属性选择器-重要九、CSS的作用及字体样式十、文本样式十一、文本阴影和超链接伪类十二、列表样式十三、背景图像应用及渐变十四、盒子模型及边框使用十五、div居 ...
前端学习二（css）
一、使用css三种方式
1、外链式：在head中通过link链接外部css文件
2、嵌入式：通过style标签里面写css，通常在head里面
3、内联式：通过标签本身的style属性，在标签上写样式
<!DOCTYPE html>
<HTML>
<head>
<title>学习css</title>
<meta charset="utf-8">
<!-- 在html中使用css三种方 ...
WEB开发-CSS入门学习总结
HTML学习完成以后，我们就要开始学习CSS的相关知识，CSS是用来修饰网页内容的一种语言。
层叠样式表（Cascading Style Sheets，缩写：CSS），是一种样式表语言，描述如何显示HTML元素。
引入方式
1.内联/行内
<p style='color:red;'>使用style属性</p>
2.内部样式
在head标签里面添加style标签里写样式
<head>
<titl ...
CSS学习
# 1、什么是CSS
如何学习
1. CSS是什么2. CSS怎么用（快速入门）3. CSS选择器（重点+难点）4. 美化网页（文字，阴影，超链接，列表，渐变....）5. 盒子模型6. 浮动7. 定位8. 网页动画（特效效果）
## 1.1、什么是CSS
Cascading Style Sheet层叠级联样式表
CSS：表现（美化网页）
字体，颜色，边距，高度，宽度，背景 ...
CSS学习
CSS学习
1 CSS简介
Cascading Style Sheet 层叠级联样式表
CSS：表现（美化网页）字体，颜色，边距，高度，宽度，背景图片，网页定位浮动等等
2 选择器
2.1 标签选择器
css注释符：/**/
2.1.1 内部样式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
<!--
...
html css 学习
html,css学习笔记
《!DOCTYPE html》 文档类型声明
《html lang="en/zh-CN"》网页显示语言
《head》
《style type="text/css"》
div.sassd（class格式）{.......内容样式}
#ggg（id格式）a {。。。。内容样式}
《/style》
《/head》
《meta charset="utf-8"》字符集 utf-8万国码
《br/》换行 《p》《/p》段落
《ink r ...
杂谈: 从XAML学习HTML+CSS需要多久？(连载)
前言
对于XAML或者HTML来讲, 他们本质上都是作为一种标记语言, 它们都是主要用于描述程序用户界面而存在。这样说来, 只要我们对某种标记语言熟悉, 那么学习其他类似的标记语言, 无非就是表达形式和语法的差异。
为了搞清楚这点, 我们需要做的就是捋清楚WPF当中的声明方式方法, 然后类推找到HTML中相同的实现方法, 以及HTML ...
前端学习4百度页面添加CSS样式210904
前端学习4百度页面添加CSS样式210904
一.查看并实现各个小细节出的功能把，功能导向
细一点就好
1.标签上的小图标：
把favicon.ico图标放到网站根目录下，在网页的<head></head>中加入
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
（1）常用的图标网站：
1.网址：iconfont-阿里巴巴矢量图标库 ...
CSS基本标签学习8.20
作业：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>山东理工大学</title>
<link rel="shortcut icon" href="./logo.ico">
<link rel="stylesheet" href="sdlg.css">
</head>
<body>
<!--整个页面-->
<div class="all">
<!--头部导航-->
<d ...
Css学习
什么是CSS
怎么学习
css是什么
css怎么用
Css选择器（重点+难点）
美化网页（文字，阴影，超链接，列表，渐变）
盒子模型
浮动
定位
网页动画（特效）
什么是Css
层叠样式表
CSS：表现（美化网页）
字体、颜色、边框、高度、宽度、背景图片、网页定位、网页浮动
快速入门
内联样式规范，<style>可以编写css ...
