CSS笔记(10)
CSS笔记(2)
CSS字体属性 CSS Font(字体)属性用来定义字体系列:大小,粗细和文字样式(如斜体). 文字字体 CSS使用font-family属性定义文本的字体系列文字大小 CSS使用font-size属性定义文字大小 文字粗细 CSS使用font-weight 设置文字的粗细效果,400等价于normal,默认粗细字体,700等价于bold,粗体,注意后面不需要跟单位!!!文字样式 C
日期 2023-06-12 10:48:40
CSS笔记(6)
CSS笔记(6) 上一节的背景图片位置还没写完就匆匆发表了,现在接着后面的内容.背景图片位置 1.参数是方位名词(上一节) 2.参数是精确单位如果参数是精确坐标,那么第一个肯定是x坐标,第二个肯定是y坐标.如果只指定一个数值,那该数值一定是x坐标,另一个默认垂直居中. 3.参数是混合单位:如果两个值是精确单位和方位名词混合使用,则第一个是x坐标,第二个是y坐标. 背景图像固定(背景附着)
日期 2023-06-12 10:48:40
CSS笔记(7)
CSS盒子模型 终于学到新内容啦!CSS的盒子模型,其实学到这里有些东西已经懵懵的了,听都听得懂,因为老师讲的实在是很好,但还是害怕实际运用的时候不知所措...不管了先学吧.居然还要学习一点PS...又要重新下载,心累.网页布局过程: 1.先准备好相关的网页元素,网页元素基本都是盒子BOX. 2.利用CSS设置好盒子样式,然后摆放到相应位置. 3.往盒子里装内容. 网页布局
日期 2023-06-12 10:48:40CSS笔记(14)
CSS定位为什么需要定位?浮动可以让多个块级盒子一行没有缝隙排列显示,经常用于横向排列盒子.定位则是可以让盒子自由的在某个盒子内移动位置或者固定屏幕中某个位置,并且可以压住其他盒子.定位 将盒子定在某一个位置,所以定位也是在摆盒子,按照定位的方式移动盒子.定位=定位模式+边偏移. 定位模式用于指定一个元素在文档中的定位方式,边偏移则决定了该元素的最终位置. 定位模式 定位模式决定
日期 2023-06-12 10:48:40
CSS笔记(18)
今天继续学习CSS的高级技巧.溢出的文字省略号显示单行文本溢出显示省略号 尝试了一下,效果图:多行文本溢出显示省略号 因为要考虑兼容性的问题,使用的时候直接粘贴即可. text-overflow: ellipsis; /* 弹性伸缩盒子模型显示 */ display: -webkit-box; /*
日期 2023-06-12 10:48:40
CSS笔记(20) 非常重要
好几天没有更新,因为我在偷懒... 又到了新的内容了,现在学习HTML5和CSS3的新特征. HTML的新增特性主要是针对于以前的不足,增加了一些新的表单,新的标签和新的表单属性等. 这些新特性都有兼容性问题,基本是IE9+以上版本的浏览器才支持,如果不考虑兼容性的问题,可以大量使用这些新特性.(呵呵,IE我杀了你) 声明: 新特性增加了很多,但是我们专注于开发常用的新特性.基础班讲解部分新
日期 2023-06-12 10:48:40CSS笔记(25)之动画animation
CSS3动画 动画(animation)是CSS3中具有颠覆性的特征之一,可通过设置多个节点来精确控制一个或一组动画,常用来实现复杂的动画效果. 相比较过渡,动画可以实现更多变化,更多控制,连续自动播放等效果. 动画的基本使用制作动画分两步: 先定义动画再使用(调用)动画.用keyframes定义动画(类似定义类选择器)@keyframes 动画名称 { 0% {
日期 2023-06-12 10:48:40CSS笔记
CSS笔记一、基本知识1.1 CSS选择器1.2 创建二、样式1. 背景2. 文本3. 字体4. 链接5. 列表6. 表格8. js 中获取高/宽9. 隐藏模块10. :nth-child11. vh/vw与%区别12. export default 和 export 区别13. undefined与null的区别14. 击穿Scoped三、进阶1. 盒模型2. display 属性 + posi
日期 2023-06-12 10:48:40
HTML&CSS精选笔记_CSS高级技巧详解编程语言
CSS精灵是一种处理网页背景图像的方式。它将一个页面涉及到的所有零星背景图像都集中到一张大图中去，然后将大图应用于网页，这样，当用户访问该页面时，只需向服务发送一次请求，网页中的背景图像即可全部展示出来。通常情况下，这个由很多小的背景图像合成的大图被称为精灵图， CSS 精灵其实是将网页中的一些背景图像整合到一张大图中（精灵图）。然而，各个网页元素通常只需要精灵图中不同位置的某个小图，
日期 2023-06-12 10:48:40HTML&CSS精选笔记_浮动与定位详解编程语言
什么是浮动？元素的浮动是指设置了浮动属性的元素会脱离标准文档流的控制，移动到其父元素中指定位置的过程。 如何定义浮动？在CSS中，通过float属性来定义浮动，其基本语法格式如下： 选择器{float:属性值;} float属性值left 元素向左浮动right 元素向右浮动none 元素不浮动（默认值） 为什么要清除浮动？由于浮动元素不再占用原文档流的位置，所以它会对页面中
日期 2023-06-12 10:48:40HTML&CSS精选笔记_盒子模型详解编程语言
所谓盒子模型就是把HTML页面中的元素看作是一个矩形的盒子，也就是一个盛装内容的容器。每个矩形都由元素的内容、内边距（padding）、边框（border）和外边距（margin）组成。 网页就是多个盒子嵌套排列的结果。 内边距出现在内容区域的周围，当给元素添加背景色或背景图像时，该元素的背景色或背景图像也将出现在内边距中。 外边距是该元素与相邻元素之间的距离。 如果给元素定义边框属性，边
日期 2023-06-12 10:48:40HTML&CSS精选笔记_CSS入门详解编程语言
选择器{属性1:属性值1; 属性2:属性值2; 属性3:属性值3;} CSS代码结构中的特点 CSS样式中的选择器严格区分大小写，属性和值不区分大小写，按照书写习惯一般将“选择器、属性和值”都采用小写的方式。 多个属性之间必须用英文状态下的分号隔开，最后一个属性后的分号可以省略，但是，为了便于增加新样式最好保留。 如果属性的值由多个单词组成且中间包含空格，则必须为这个属性值加上英文状态
日期 2023-06-12 10:48:40CSS学习笔记11 CSS背景详解编程语言
background-color：背景色 前面我们经常用background-color这个属性来设置元素的背景色，例如下面这条css可将段落的背景色设置为灰色 p {background-color: gray;} 如果想要元素的背景色向外延伸，则只需增加内边距即可 background-color可以为所有元素设置背景色，这包括 body 一直到 em 和 a 等行内元素。 注意
日期 2023-06-12 10:48:40CSS学习笔记10 相对定位，绝对定位与固定定位详解编程语言
文档流中的元素的位置由元素在 (X)HTML 中的位置决定，这就是最原始的普通流，前面讲到的浮动CSS学习笔记08 浮动可以改变元素在文档流中的位置，除了这个我们还可以通过使用CSS的position 属性，来重新决定元素在文档流中的位置。 position 属性值 static：默认的文档流的布局的方式，块级元素生成一个矩形框，作为文档流的一部分，行内元素则会创建一个或多个行框，置于其父元素
日期 2023-06-12 10:48:40CSS学习笔记08 浮动详解编程语言
从CSS学习笔记05 display属性一文中，我们知道div是块元素，会独占一行，即使div的宽度很小，像下面这样 应用display属性的inline属性可以让div与div共享一行，除了这种方法外，还有没有其他方法可以实现这种效果呢，答案是肯定的，那就是下面要介绍的CSS的浮动特性，浮动从字面意思上来看，就是浮起来，动起来，那么是谁浮起来，又是谁动起来呢？往下看，很快就会知道答案了。
日期 2023-06-12 10:48:40CSS学习笔记07 盒子模型详解编程语言
1、盒子模型 所谓盒子模型就是把HTML页面中的元素看作是一个矩形的盒子，也就是一个盛装内容的容器。每个矩形都由元素的内容、内边距（padding）、边框（border）和外边距（margin）组成。 用公式表示就是：盒子=边框+内边距+内容区域+外边距 元素框的最内部分是实际的内容，直接包围内容的是内边距。内边距呈现了元素的背景。内边距的边缘是边框。边框以外是外边距，外边距默认是透明的
日期 2023-06-12 10:48:40CSS学习笔记06 简单理解line-height详解编程语言
在制作页面的时候，经常会遇到文本图片需要居中的情况，这时候，只要设置下文本的line-height属性等于包裹该文本的元素的高度即可让文本居中显示了，先来看看这个现象。 1 !DOCTYPE html 2 html lang="en" 3 head 4 meta charset="UTF-8" 5 title 行高 /title 6 style type="tex
日期 2023-06-12 10:48:40CSS学习笔记02 CSS选择器详解编程语言
1、通配符选择器 通配符选择器用“* 号表示，是所有选择器中作用范围最广的，能匹配页面中所有的元素 /*设置当前页面中所有标签的颜色为红色*/ color: red; } 2、标签选择器 标签选择器就是选择当前页面中相同名字的标签 /*设置所有p标签的文字颜色为红色*/ color: red; } 3、ID选择器 id选择器使用 # 进行标识，后面紧跟id名 /
日期 2023-06-12 10:48:40CSS学习笔记01 CSS简介详解编程语言
1、CSS定义 CSS 指层叠样式表 (Cascading Style Sheets)，是一种样式表语言，用来描述 HTML 或 XML（包括如 SVG、XHTML 之类的 XML 分支语言）文档的呈现。CSS 描述了在屏幕、纸质、音频等其它媒体上的元素应该如何被渲染的问题。 2、为何使用CSS 网页是由HTML标签组成的，那么这些标签会根据浏览器的默认方式进行排版与样式的渲染，如果想要更改
日期 2023-06-12 10:48:40精通css+div 读书笔记详解编程语言
第一章 Css 初步体验 Css（Cascading style sheet），中文译为层叠样式表，主要用于控制网页样式并允许将样式信息与网页内容分析的一种标记性语言。Css 是1996年通过W3c审核的，并且推介使用。层叠样式表可能不太好理解，这里使用firefox（火狐）浏览器，点击右键查看元素，打开控制台 找到设置，点击3D视图打开，这时你就能看到这样一个东西，点击它，你就明白为什么
日期 2023-06-12 10:48:40淘宝段正淳的css笔记大全
试想过总结出这几年来写css与xhtml的经验，汇总成一片”旷世奇文”分享给大家。无奈寡人年世已高，真是有点力不从心了。于是转念一想，可以用笔记的形式展现，这样就不用担心写不出来了。 现在就来说个淘宝首页上的一个小技巧。 类目之间的横竖线 从很久很久以前开始，类目间的竖线无非都只有三种。 背景图在a标签设置一个padding用宽1px高不等的背景图来position到右侧。缺点：最后一个还是
日期 2023-06-12 10:48:40DIV+CSS导航学习笔记
meta http-equiv="Content-Type" content="text/html;charset=utf-8" / meta http-equiv="Content-Language" content="zh-cn" / link rel="stylesheet" type="text/css" href="headline.css" / link rel="
日期 2023-06-12 10:48:40css小笔记
一、优先级 二、伪类 三、伪元素 ::first-line ::first-letter ::before ::after ::selection 伪元素共有5个，selection是css3新加的，表示选中的文字，css2伪元素和伪类是一样只有一个：而css3规定伪元素要用两个： 四、background-size值为cover和值为100%的区别 background
日期 2023-06-12 10:48:40CSS选择器笔记
去年我学jQuery的时候，曾经做过一点选择器（selector）的笔记。 这几天拿出来看了一下，发现很多都忘记了。所以，我决定把它们贴在这里，方便以后查看。这对其他朋友应该也是有用的，毕竟选择器是制作网页效果的第一步。 笔记分为两个部分，今天是CSS的选择器，以后还有一部分xPath的选择器。今天的笔记中包括44个选择器，基本涵盖了CSS 2和CSS 3的所有规定。 ===========
日期 2023-06-12 10:48:40css flex属性学习笔记
参考文献 flex: 1 0 calc( (100% / min(var(--cx-active-view), var(--cx-max-views))) - var(-
日期 2023-06-12 10:48:40Web前端开发CSS笔记
CSS 层叠样式 CSS引用:直接引用 直接在HTML标签的后面加上style类型声明即可,多个类型请用分号隔开. <body> <p style="color: red"> hello lyshark </p> <div style="color: yel
日期 2023-06-12 10:48:40【CSS笔记】CSS布局之五种定位方式（静态、相对、绝对、固定、粘性）
目录 一、CSS定位布局 1.1、static静态定位 1.2、relative相对定位 1.3、fixed固定定位 1.4、absolute绝对定位 （1）默认绝对定位参考点 （2）设置绝对定位参考点 1.5、sticky粘性定位 （1）sticky粘性
日期 2023-06-12 10:48:40vue—你必须知道的 js数据类型 前端学习 CSS 居中 事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记（一） web攻击 web安全之XSS JSONP && CORS css 定位 react小结
vue—你必须知道的 目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript 经验总结 更多总结 猛戳这里 属性与方法 不要在实例属性或者回调函数中（例如,vm.$watch('a',
日期 2023-06-12 10:48:40HTML5与CSS3权威指南笔记案例1
第1章 <!DOCTYPE html> <meta charset = "UTF-8">
日期 2023-06-12 10:48:40HTML5 + CSS3 页面结构学习笔记（五）
页面结构学习 页面结构学习页面结构分析常用元素列表页面演示示例 iframe内联框架多个iFrame嵌套使用实现页面的切换演示示例 页面结构学习 页面结构分析 页面
日期 2023-06-12 10:48:40HTML5 + CSS3 标签学习笔记（二）
HTML基本标签学习 常见标签学习基本标签字体标签特殊标签 标签使用演示标题标签段落标签换行标签水平线标签字体样式标签特殊符号 图像标签概念补充 常见标签学习 基本标签 基本标签
日期 2023-06-12 10:48:40