zl程序教程

前端学习之CSS

  • 前端学习 -- Html&Css -- 表格

    前端学习 -- Html&Css -- 表格

    表格在日常生活中使用的非常的多,比如excel就是专门用来创建表格的工具,表格就是用来表示一些格式化的数据的,比如:课程表、银行对账单。在网页中也可以来创建出不同的表格。 在HTML中,使用table标签来创建一个表格,在table标签中使用tr来表示表格中的一行,有几行就有几个tr,在tr中需要使用td来创建一个单元格,有几个单元格就有几个td,rowspan用来设置纵向的合并单元格,cols

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Html&Css -- 背景

    前端学习 -- Html&Css -- 背景

    background 在一个声明中设置所有的背景属性。 background-attachment 设置背景图像是否固定或者随着页面的其余部分滚动。 background-color 设置元素的背景颜色。 background-image 设置元素的背景图像。 background-position 设置背景图像的开始位置。 background

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- overflow

    前端学习 -- Css -- overflow

    子元素默认是存在于父元素的内容区中,理论上讲子元素的最大可以等于父元素内容区大小。如果子元素的大小超过了父元素的内容区,则超过的大小会在父元素以外的位置显示,超出父元素的内容,我们称为溢出的内容。父元素默认是将溢出内容,在父元素外边显示,通过overflow可以设置父元素如何处理溢出内容:可选值:visible,默认值,不会对溢出内容做处理,元素会在父元素以外的位置显示。hidden, 溢出的内

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 默认样式

    前端学习 -- Css -- 默认样式

    浏览器为了在页面中没有样式时,也可以有一个比较好的显示效果, 所以为很多的元素都设置了一些默认的margin和padding,而它的这些默认样式,正常情况下我们是不需要使用的。 所以我们往往在编写样式之前需要将浏览器中的默认的margin和padding统统的去掉。 如何去除默认样式? 添加如下css代码: /* * 清除浏览器的默认样式 */ *

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 文本样式

    前端学习 -- Css -- 文本样式

    text-transform可以用来设置文本的大小写    可选值:    none 默认值,该怎么显示就怎么显示,不做任何处理    capitalize 单词的首字母大写,通过空格来识别单词    uppercase 所有的字母都大写    

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 行间距

    前端学习 -- Css -- 行间距

    在CSS并没有为我们提供一个直接设置行间距的方式,我们只能通过设置行高来间接的设置行间距,行高越大行间距越大。使用line-height来设置行高 。行高类似于我们上学单线本,单线本是一行一行,线与线之间的距离就是行高,网页中的文字实际上也是写在一个看不见的线中的,而文字会默认在行高中垂直居中显示。行间距 = 行高 - 字体大小。 通过设置line-height可以间接的设置行高,可以接收的值:

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 字体分类

    前端学习 -- Css -- 字体分类

    在网页中将字体分成5大类: serif(衬线字体) sans-serif(非衬线字体) monospace (等宽字体) cursive (草书字体) fantasy (虚幻字体) 可以将字体设置为这些大的分类,当设置为大的分类以后,浏览器会自动选择指定的字体并应用样式。 一般会将字体的大分类,指定为font-family中的最后一个字体。 <!DOCTYPE html>

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 字体

    前端学习 -- Css -- 字体

    设置字体颜色,使用color来设置文字的颜色 设置文字的大小,浏览器中一般默认的文字大小都是16pxfont-size设置的并不是文字本身的大小,在页面中,每个文字都是处在一个看不见的框中的我们设置的font-size实际上是设置格的高度,并不是字体的大小一般情况下文字都要比这个格要小一些,也有时会比格大,根据字体的不同,显示效果也不能。 通过font-family可以指定文字的字体 当采用某种

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 定义列表

    前端学习 -- Css -- 定义列表

    定义列表用来对一些词汇或内容进行定义 使用dl来创建一个定义列表 dl中有两个子标签 dt : 被定义的内容 dd : 对定义内容的描述 同样dl和ul和ol之间都可以互相嵌套 <!DOCTYPE html> <html> <head> <meta charset="UTF-8">

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 有序列表和无序列表

    前端学习 -- Css -- 有序列表和无序列表

    列表就相当于去超市购物时的那个购物清单, 在HTML也可以创建列表,在网页中一共有三种列表: 1.无序列表 2.有序列表 3.定义列表 无序列表 - 使用ul标签来创建一个无序列表 - 使用li在ul中创建一个一个的列表项, 一个li就是一个列表项 通过type属性可以修改无序列表的项目符号 可选值: disc,默认

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 属性选择器

    前端学习 -- Css -- 属性选择器

    属性选择器:根据元素的属性选择指定元素 语法:[属性名] 选取含有指定属性的元素 [属性名="属性值"]:选取属性值等于指定值的元素 [属性名^="属性值"]:选取属性值以指定内容开头的元素 [属性名$="属性值"]:选取属性值以指定内容结尾的元素 [属性名*="属性值"]:选取属性值中包含指定内容的元素 demo:(注:这么尴尬的诗句肯定不是我写的) <!DOCTYPE

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css

    前端学习 -- Css

    Css:Cascading Style Sheets CSS叫做层叠样式表,用来设置页面中元素的样式。背景颜色、字体颜色、字体大小。。。 编写位置:   1,内联样式:     将样式编写到标签的style属性中     <p style="color:red;"></p>      <!doctype html> <html> <

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 内联元素的盒模型

    前端学习 -- Css -- 内联元素的盒模型

    内联元素不能设置width和height; 设置水平内边距,内联元素可以设置水平方向的内边距:padding-left,padding-right; 垂直方向内边距,内联元素可以设置垂直方向内边距,但是不会影响页面的布局; 为元素设置边框,内联元素可以设置边框,但是垂直的边框不会影响到页面的布局; 水平外边距内联元素支持水平方向的外边距; 内联元素不支持垂直外边距; 为右边的元素设置一个左外边

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 盒子模式

    前端学习 -- Css -- 盒子模式

    框模型: CSS处理网页时,它认为每个元素都包含在一个不可见的盒子里。 为什么要想象成盒子呢?因为如果把所有的元素都想象成盒子,那么我们对网页的布局就相当于是摆放盒子。我们只需要将相应的盒子摆放到网页中相应的位置即可完成网页的布局。   一个盒子我们会分成几个部分:– 内容区(content)上图的element区域– 内边距(padding)– 边框(border)– 外边距(m

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 定义列表

    前端学习 -- Css -- 定义列表

    定义列表用来对一些词汇或内容进行定义 使用dl来创建一个定义列表 dl中有两个子标签 dt : 被定义的内容 dd : 对定义内容的描述 同样dl和ul和ol之间都可以互相嵌套 <!DOCTYPE html> <html> <head> <meta charset="UTF-8">

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 样式的继承

    前端学习 -- Css -- 样式的继承

    像儿子可以继承父亲的遗产一样,在CSS中,祖先元素上的样式,也会被他的后代元素所继承, 利用继承,可以将一些基本的样式设置给祖先元素,这样所有的后代元素将会自动继承这些样式。 但是并不是所有的样式都会被子元素所继承,比如:背景相关的样式都不会被继承 边框相关的样式 定位相关的 <!DOCTYPE html> <html> <head>

    日期 2023-06-12 10:48:40     
  • 前端学习 --Css -- 子元素的伪类

    前端学习 --Css -- 子元素的伪类

    :first-child 寻找父元素的第一个子元素,在所有的子元素中排序; :last-child 寻找父元素的最后一个子元素,在所有的子元素中排序; :nth-child 寻找父元素中的指定位置子元素,在所有的子元素中排序; :first-of-type 寻找指定类型中的第一个子元素 :last-of-type 寻找指定类型中的最后一个子元素

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css -- 伪元素

    前端学习 -- Css -- 伪元素

    :first-letter 表示第一个字符 :first-line 表示文字的第一行 :before 选中元素的最前边,一般该伪类都会结合content一起使用,通过content可以向指定位置添加内容。 :after 选中元素的最后边,一般该伪类都会结合content一起使用,通过content可以向指定位置添加内容。 first-letter demo:

    日期 2023-06-12 10:48:40     
  • 前端学习 -- Css

    前端学习 -- Css

    Css:Cascading Style Sheets CSS叫做层叠样式表,用来设置页面中元素的样式。背景颜色、字体颜色、字体大小。。。 编写位置:   1,内联样式:     将样式编写到标签的style属性中     <p style="color:red;"></p>      <!doctype html> <html> <

    日期 2023-06-12 10:48:40     
  • vue—你必须知道的       js数据类型    前端学习    CSS 居中    事件委托和this    让js调试更简单—console   AMD && CMD   模式识别课程笔记(一)   web攻击   web安全之XSS  JSONP && CORS   css 定位  react小结

    vue—你必须知道的 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:40     
  • 网站建设设计前端开发需要学习html和div+css

    网站建设设计前端开发需要学习html和div+css

    这些与时俱进的东西一定要看,到这步的时候你会发现其实看什么,学什么都没有刚开始那么迷茫和艰难了。邢台网站建设)www.nannantao.com 1、熟练掌握html基本知识,包括每个标签的用法等。这个建议网上找个视频看看,因为也不会太长的,这个是前端开发的信息结构。 2、熟练掌握div+css基本知识,这个东西基本就是前端的基础了,它可以将你写的东西直观的展示出效果给你看,所以须熟练掌握。

    日期 2023-06-12 10:48:40     
  • 【前端学习之HTML&CSS】-- CSS第十篇 -- 更多的样式

    【前端学习之HTML&CSS】-- CSS第十篇 -- 更多的样式

    【前端学习之HTML&CSS】-- CSS第十篇 – 更多的样式 文章目录 【前端学习之HTML&CSS】-- CSS第十篇 -- 更多的样式前言1. 透明度2. 鼠标3. 盒子隐藏4. 背景

    日期 2023-06-12 10:48:40     
  • 【前端学习之HTML&CSS】-- 视觉格式化模型之三 定位练习

    【前端学习之HTML&CSS】-- 视觉格式化模型之三 定位练习

    【前端学习之HTML&CSS】-- 视觉格式化模型之三 定位练习 文章目录 【前端学习之HTML&CSS】-- 视觉格式化模型之三 定位练习前言一、二级菜单代码HTML + CSS结果

    日期 2023-06-12 10:48:40     
  • 【前端学习之HTML&CSS】-- 视觉格式化模型之二 浮动 -- 练习

    【前端学习之HTML&CSS】-- 视觉格式化模型之二 浮动 -- 练习

    【前端学习之HTML&CSS】-- 视觉格式化模型之二 浮动 – 练习 文章目录 【前端学习之HTML&CSS】-- 视觉格式化模型之二 浮动 -- 练习前言设计稿/原有样式代码编辑实际效果展

    日期 2023-06-12 10:48:40     
  • 【前端学习之HTML&CSS】-- CSS第七篇 -- 视觉格式化模型之二 浮动

    【前端学习之HTML&CSS】-- CSS第七篇 -- 视觉格式化模型之二 浮动

    【前端学习之HTML&CSS】-- CSS第七篇 – 视觉格式化模型之二 浮动 文章目录 【前端学习之HTML&CSS】-- CSS第七篇 -- 视觉格式化模型之二 浮动前言1. 应用场景2.

    日期 2023-06-12 10:48:40     
  • 【前端学习之HTML&CSS】-- CSS第五篇 -- 盒模型及其应用

    【前端学习之HTML&CSS】-- CSS第五篇 -- 盒模型及其应用

    【前端学习之HTML&CSS】-- CSS第五篇 – 盒模型及其应用 文章目录 【前端学习之HTML&CSS】-- CSS第五篇 -- 盒模型及其应用前言一、盒模型1. 含义2. 盒子类型3.

    日期 2023-06-12 10:48:40     
  • 【前端学习之HTML&CSS】-- CSS第四篇 -- 层叠、继承与属性值计算

    【前端学习之HTML&CSS】-- CSS第四篇 -- 层叠、继承与属性值计算

    【前端学习之HTML&CSS】-- CSS第四篇 – 层叠、继承与属性值计算 文章目录 【前端学习之HTML&CSS】-- CSS第四篇 -- 层叠、继承与属性值计算前言一、层叠1. 基本概念

    日期 2023-06-12 10:48:40     
  • 【前端学习之HTML&CSS】-- CSS第三篇 -- 选择器(下)

    【前端学习之HTML&CSS】-- CSS第三篇 -- 选择器(下)

    【前端学习之HTML&CSS】-- CSS第三篇 – 选择器(下) 文章目录 【前端学习之HTML&CSS】-- CSS第三篇 -- 选择器(下&#x

    日期 2023-06-12 10:48:40     
  • 【前端学习之HTML&CSS】-- CSS第三篇 -- 选择器(上)

    【前端学习之HTML&CSS】-- CSS第三篇 -- 选择器(上)

    【前端学习之HTML&CSS】-- CSS第三篇 – 选择器(上) 文章目录 【前端学习之HTML&CSS】-- CSS第三篇 -- 选择器(上&#x

    日期 2023-06-12 10:48:40     
  • 【前端学习之HTML&CSS】-- HTML第六篇 -- a元素与路径

    【前端学习之HTML&CSS】-- HTML第六篇 -- a元素与路径

    【前端学习之HTML&CSS】-- 第六篇 – a元素与路径 文章目录 【前端学习之HTML&CSS】-- 第六篇 -- a元素与路径前言a元素1. href属性2. id属性:

    日期 2023-06-12 10:48:40     
  • 前端学习之路-CSS介绍,Html介绍,JavaScript介绍

    前端学习之路-CSS介绍,Html介绍,JavaScript介绍

    CSS介绍 学前端必备掌握CSS样式,css为层叠样式表,用来定义页面的显示效果,加强用户的体验乐趣,那么如何用css到h

    日期 2023-06-12 10:48:40