层叠样式表 (Cascading Style Sheets)，一种用来为结构化文档（如 HTML 文档或 XML 应用）添加样式（字体、间距和颜色等）的计算机语言
今天是第九天的笔记,主要是HTML和CSS的,希望大家支持~ 在此之前先为大家显示下前端工程师的路线图: 第九天的笔记:HTML AND CSS: -复习：HTML类： 定义类选择器：.cc{ color=""; } 类选择器引用： -复习：块级元素： :可以用作其他HTML元素的容器，同个类可以设置 多个块级元素。 例： -复习元素：行内元素，可以作为文本的容器，同个类可以设置多个行 内元素。 例：cccccc HTML布局： 多列显示内容：解析： 样式标签 #header {定义头部的
云函数是一段运行在云端的代码，无需管理服务器，在开发工具内编写，一键上传部署即可运行后端的代码。
本文内容概要： 1 CSS选择器 2 盒模型 3 浮动 4 页面布局案例 5 课后习题 上周我们详解的讲解了一个网站的开发流程以及如何使用标签来进行一个网页的布局操作，那本周的这篇文章我们主要与大家分享的是如何去实现我们网页的布局，这也是作为前端的我们需要做的第一个大操作——实现网站的页面布局。本文主要讲解CSS的基本选择器、盒模型、浮动等知识点，并会提供一个布局案例来给大家做参考。 在上周，在文章的最后给大家留了一个网页结构的案例，通过使用讲解的所有标签来书写了一个页面，可是在那个页面里面，我们只能看到最
结构 head title meta body 文本 标题和段落 粗体和斜体 上标和下标 空白（白色空间折叠） 折行和水平标尺 语义化标记 加粗和强调 引用 缩写词和首字母缩写词 引文 所有者联系信息 内容的修改 列表（list） 有序列表（ordered list） 无序列表（unordered list） 定义列表（definition list） 链接（anchor） 页面链接 锚链接 功能链接 图像（image） 图像存储位置 图像及其宽高 选择正确的图像格式 JPEG GIF PNG 矢量图 fi
使用CSS渲染页面 简介 CSS的作用 CSS的工作原理 规则、属性和值 常用选择器 颜色（color） 如何指定颜色 颜色术语和颜色对比 背景色 文本（text / font） 文本的大小和字型(font-size / font-family) 粗细、样式、拉伸和装饰(font-weight / font-style / font-stretch / text-decoration) 行间距(line-height)、字母间距(letter-spacing)和单词间距(w
欢迎回来三钻的FCC前端教程，上一篇文章我们通过28关学会了HTML与HTML5网页开发基础。这一期我们一起攻破前端第二大知识点《CSS基础入门》。因为这一课一共有44关，我把文章分成两期更新。敬请期待！
HTML，全称超文本标记语言（Hypertext Markup Language），是一种用于创建网页的标准标记语言。HTML为网页提供了一种结构性的标记方式，使得浏览器可以正确地解析和显示网页内容。
新浪导航栏的核心就是因为里面的字数不一样多，所以我们不方便给宽度，还是给padding ，撑开盒子的。
CSS盒子模型是网页布局的基础之一，它定义了HTML元素在页面上的占用空间和相互关系。理解CSS盒子模型对于构建各种类型的网页布局至关重要。在本文中，我们将深入探讨CSS盒子模型的各个方面，包括盒子模型的概念、属性和如何使用它们来控制元素的大小和间距。
文件标签html、head、title、body。html5使用<!DOCTYPE html>表示html文档，meta的charset指定字符集。注释 文本标签h1--h6（标题标签），p（段落），br（普通回车解析为空字符），hr（水平线，color颜色，width宽度，size高度，alien对其方式[center left right]），b（加粗），i（斜体），font（字体，color颜色、size大小、face字体） 标签属性中，color颜色表示：可以用red等，建议#值1值2值3（红绿蓝）（取色器）。width表示：数值（px），百分号（占比，相对父元素）。center标签，居中。 特殊字符，对应的字符编码表。手册-->符号。 图片标签img 自闭合（src路径[相对路径即可]，alien[部分不支持]，alt加载失败显示，width宽，height高）。 列表标签：有序ol（order list，属性type更换样式，start起始位置）、li（每一项）。无序列表ul（unorder list，type），li（每一项）。 链接标签：a标签（属性href跳转URL[本地或网络]（mailto:xxx@qq.com选项启动本地邮件），target属性_self本页面打开_blank新建选项卡） 块标签：span（包裹作用，默认无效果，默认不换行一行），div标签，自动换行。 语义化标签：header，footer，用来提高程序可读性，结合css使用。（html5）。 表格：只有行的概念。table定义表格（border线宽，width宽度，cellpadding边沿内容间空白，cellspacing单元格间空白，bgcolor背景色，alien对齐），tr定义行（颜色，对其方式），td定义行内单元格（rowspan行合并，colspan列合并，以第一个行单元格写入），th定义表头单元格。 caption表格标题。thead，tbody，tfoot（类似语义化标签，有位置定义作用，非html5）。
padding 属性值设置 : 设置 1 ~ 4 个 值 , 单位 像素 px ;
HTML 的 一个布局 可以看做一个 矩形的 盒子模型 , 该 盒子模型 是一个用于 容纳 标签元素 的容器 ;
导航栏文本 有 10 像素内边距 , 20 像素外边距 , 文本输入框 表单 , 距离 导航栏外边距有 65 像素 ;
1、内边框是用box-sizing属性设置的。box-sizing属性允许您以特定的方式定义匹配某个区域的特定元素。
其实，CSS就三个大模块： 盒子模型 、 浮动 、 定位，其余的都是细节。要求这三部分，无论如何也要学的非常精通。
网页是一个多层的结构，一层摞着一层，通过CSS可以分别为每一层来设置样式，作为用户来讲只能看到最顶上一层，这些层中，最底下的一层称为文档流，文档流是网页的基础， 我们所创建的元素默认都是在文档流中进行排列，
对于如何使用 CSS 制作一个半透明边框，首先你要知道 background-clip 这个属性
盒子模型又称为框模型，HTML页面所有的元素都具有盒子模型，该模型用于设计HTML页面和实现HTML页面布局。
模仿 CSDN 博客界面的导航栏 , 将下图中 矩形框 中的导航栏 样式写出来 ;
一个盒子中主要的属性就5个：width、height、padding、border、margin。 width是“宽度”的意思，CSS中width指的是内容的宽度，而不是盒子的宽度。 height是“高度”的意思，CSS中height指的是内容的高度，而不是盒子的高度 padding是“内边距”的意思 border是“边框” margin是“外边距”
选择器主要作用是为了确定需要改变样式的HTML元素 每一条声明由一个属性和一个值组成，使用花括号来包围声明，属性与值之间使用冒号(:)分开
当然如果没有学习之前的知识，可以到我的主页中查看之前的文章：秋落雨微凉 - 博客园
计划安排见：【腾讯文档】三峡大学文档资源 主要内容：WEB端三剑客HTML+CSS+JavaScript 实验网址：Java爬虫框架WebMagic
最近才第一次接触这个Normalize.css，之前Jeff 都是采用CSS Reset的，但如今发现现在流行这个Normalize.css 了。自己也查阅了不少资料去了解，现在权当是笔记放在这里吧。 Normalize.css 简介 官方网站：http://necolas.github.io/normalize.css/ 浏览器支持情况：Chrome, Firefox, Opera, Safari 6+, IE 8+ Normalize.css 是一个可以定制的CSS文件，它让不同的浏览器在渲染网页元素的
终于学到新内容啦!CSS的盒子模型,其实学到这里有些东西已经懵懵的了,听都听得懂,因为老师讲的实在是很好,但还是害怕实际运用的时候不知所措...不管了先学吧.居然还要学习一点PS...又要重新下载,心累.
<head> </head> 指定html文档的一些属性，例如页面标题，字符集和关键字等-
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> a:after{ content: "("attr(href)")"; } </style> </head> <body>
格式： 粗细（ px ） 样式 (solid double dashed dotted) 颜色
举例子： 结论 1.在HTML中所有的标签都可以设置 宽度/高度 == 指定可以存放内容的区域 内边距 == 填充物 边框 == 手机盒子自己 外边距 == 盒子和盒子之间的间隙
如果没有给一个盒子指定宽度， 此时，如果给这个盒子指定padding， 则不会撑开盒子。
首先我们建立 HTML 的基本结构，定义 HTML 文档的类型、语言、头部信息以及页面内容。
在Web设计中，盒模型是理解页面布局和元素尺寸的基础概念。它包括内容区域、内边距（padding）、边框（border）和外边距（margin）。本文将深入浅出地介绍盒模型的这些组成部分，分析在使用过程中常见的问题、易错点以及如何避免，同时提供实用的代码示例。
css&javascript 一.CSS 1.CSS介绍 CSS 指层叠样式表 (Cascading Style Sheets),用来定义网页的显示效果。 把样式添加到HTML中，可以将网页内容与显
注意：以上方法是让块级元素水平居中，行内元素或者行内块元素水平居中给其父元素添加 text-align:center 即可
本节所有的代码: https://download.csdn.net/download/qq_44273429/12729648 未完待续，，， 下一节链接: Web前端基础（04）
CSS 1.1 CSS 编写的位置 使用CSS来修改元素的样式 第一种方式：内联样式/行内样式 第二种方式：内部样式表 第三种方式：外部样式表(最佳实践) 1.1.1 内联样式 在标签内部通过style属性来设置元素的样式 问题: 使用内联样式，样式只能对一个标签生效， 如果希望影响到多个元素必须在每一个元素中都复制一遍 并且当样式发生变化时，我们必须要个一个的修改， 非常的不方 便 注意:开发时绝对不要使用内联样式 <p style="color: red; fon
当涉及到网页设计和排版时，CSS盒子模型是一个非常重要的概念。理解盒子模型是构建网页布局的关键，它定义了元素在网页中的尺寸和排列方式。在本文中，我们将深入探讨CSS盒子模型的各个方面，包括它的基本构成、如何影响元素的布局和尺寸，以及如何在实际项目中应用它。
值： (1)、normal(正常)；bold(加粗)；（<==常用） (2)、纯数字：100~900的整百数；
「3. CSS」CSS(Cascading Style Sheets)通常称为CSS样式表或层叠样式表(级联样式表)。
描述：在 HTML 中首先会使用 CSS 来对元素进行定位，我们将学习如何使用 CSS 来控制和定位网页元素的位置、大小和布局。
设置元素边框宽度 border-width: thin| medium| thick| 长度值 设置元素边框颜色 border-color: 颜色|transparent(全透明) 设置元素边框样式 border-style: 值
导航栏 最左侧位置 , 距离 logo 盒子 有 70 像素 , 考虑到设置外边距 , 这里将 logo 盒子 与 导航栏之间的距离设置成 60 像素即可 ;
css 盒模型（Box Model）,在html中任何一个元素都可以看作盒子，这里说的盒子与现实不太一样，css中盒子是二维的，盒子由内到外分四个部分：margin(外边距)、border(边框)、padding(内边距)、content(内容)。css通过margin、border、padding三个属性来控制盒子，content是html元素的内容。
echart的安装就细不讲了，直接去官网下，实在不会的直接用cdn,省的一番口舌。
行高可以让一行文本在盒子中垂直居中对齐,文字的行高等于盒子的高度,行高-上距离-内容高度-下距离.
HTML（Hypertext Markup Language）和CSS（Cascading Style Sheets）是构建Web页面的两个基本技术。HTML负责定义页面的结构和内容，而CSS用于控制页面的样式和布局。在本篇博客中，我们将详细探讨如何将HTML和CSS结合使用，以创建精美的Web页面。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM
