经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
 CSS

未来的CSS3布局方式 ,GRID 栅格系统 -cyy

声明栅格系统的容器: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="wi...[2020/11/10]

未来的CSS3布局方式 ,GRID 栅格系统-2 -cyy

重复栅格的命名技巧: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="wi...[2020/11/10]

z-index属性详解

z-index属性详解 目录z-index属性详解一.定义和用法二.代码三.效果图 一.定义和用法 z-index属性指定一个元素的堆叠顺序,也就是z轴 position属性定义的是x轴和y轴 z-index属性必须应用到position: relative|absolute|fix...[2020/11/10]

HTML&CSS课程之图像与链接使用技巧

常用格式:jpeg=jpg png gif 比较大的图片推荐使用jpg格式,ps导出成web格式,建议选择品质80,或者不低于60 PNG无损压缩,图片会较大。多用于透明底的小图标 如果字体库里有图标,优先选择字体图标;如果没有的话,就选择png、 gif 动画特性  ...[2020/11/9]

从小变大的照片

<head> <style> * { padding: 0; margin: 0; } ul{ list-style: none...[2020/11/9]

表单与列表在HTML与CSS中是这么玩的 -cyy

表单与列表在HTML与CSS中是这么玩的 -cyy

表单应用场景实例: <form action="1.php" method="POST"> <fieldset> <legend>cyy表单</legend> &l...[2020/11/9]

多媒体与表格实战 -cyy

多媒体与表格实战 -cyy

表格的基本使用: <table border="1"> <caption>这是表格</caption> <thead> <tr> ...[2020/11/9]

css3引用方式_样式组件设计与导入技巧_vscode添加LESS支持 -cyy

CSS的引入方式共有三种:行内样式、内部样式表、外部样式表。 一、行内样式(不建议这种混排的) 使用style属性引入CSS样式。 二、内部样式表(不建议这种混排的) 在style标签中书写CSS代码。style标签写在head标签中。 三、外部样式表 CSS代码保存在扩展名为.c...[2020/11/9]

玩透 CSS 3 选择器,网页元素任意操作 -cyy

标签选择器:(范围比较大) * 通配符选择器,全部选择器 h1,h2,p,div...  标签选择器   类与ID选择器: .cla 类选择器 #id ID选择器 注意:ID选择器是唯一的,范围比较小,个人不建议使用id来定义样式,建议使用cla &n...[2020/11/9]

CSS浮动

浮动定位指: 将元素排除在普通流之外 元素将不再页面中占据空间 将浮动元素放置在包含框的左边或者右边 浮动元素依旧位于包含框之内 浮动的框可以向左或者向右移动直到他的外边缘碰到包含框或另一个浮动框的边框为止 浮动元素的外边缘不会超过其父元素的内边缘 浮动元素不会重叠 浮动元素...[2020/11/9]

elementUI的现成框架, 缺少样式, el-image样式没有, 已解决 - CN-无忧

原文链接:https: www.cnblogs.com/zizaiwuyou/p/13936063.html 前端时间要做一个上传并预览图片的功能, 前端用的库是elementUI, 有图片的控件el-image, 但是我预览的时候遇到一个问题 官方的预览效果如下:  ...[2020/11/9]

简易双色球dome分享

代码如下: <style type="text/c "> div {font-weight: bold;text-align: center;} .tone{width: 30px;height:30px;border: 2px solid #ff5151;borde...[2020/11/9]

首尾元素伪类选择_伪类选择唯一子元素_根据元素编号灵活选择_元素尾部伪类选择_not排除选择器_通过表单伪类创建个性化表单_文本伪类 -cyy

首尾元素伪类选择 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="widt...[2020/11/9]

CSS3 盒子模型全面掌握 -cyy

元素居中定义与外边距定义: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content=...[2020/11/9]

CSS 3 背景与渐变应用技巧 -cyy

背景颜色与裁切使用: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="wi...[2020/11/9]

使用 CSS 3 操作数据内容样式 -cyy

使用c 定制表格: .table{ display:table; /*相当于table*/ section{ &:nth-of-type(1){ display:table-header-group; /*相当于the...[2020/11/9]

CSS 3 浮动布局,深度挖掘 -cyy

文档流与浮动空间丢失: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="w...[2020/11/9]

CSS 3 浮动布局,深度挖掘-2 -cyy

环绕距离控制: <!DOCTYPE html> <html> <head> <title>c </title> <style type="text/c "> p{ border:2px s...[2020/11/9]

轻松掌握 CSS 3 定位布局特性 -cyy

通过定位设置尺寸: 当元素没有设置宽度和高度时,定位会影响元素的尺寸 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta na...[2020/11/9]

CSS3 FLEX 弹性盒模型让布局飞起来 -cyy

弹性布局初体验: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="widt...[2020/11/9]

CSS3 FLEX 弹性盒模型让布局飞起来-2 -cyy

布局小米移动端页面结构: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="...[2020/11/9]

python day 22 CSS拾遗之箭头,目录,图标

python day 22 CSS拾遗之箭头,目录,图标

目录 day 4 learn html 1. CSS拾遗之图标 2. html文件的目录结构 3. CSS拾遗之a包含标签 4. CSS拾遗之箭头画法 ...[2019/11/15]

day 46

目录 CSS样式操作 给字体设置长宽 字体颜色 语义 背景图片 边框 display 盒子模型 浮动(**...[2019/11/15]

前端之css(二)

前端之css(二)

目录 CSS属性相关 宽和高 字体属性 文本颜色 文本字体 字体大小 字体粗细 文字属性 ...[2019/11/15]

CSS定位

定位 将盒子定在某一个位置,所以定位也是在摆放盒子,按照定位的方式移动盒子 定位=定位模式+边偏移 定位模式用于指定一个元素在文档中的定位方式。边偏移则决定了该元素的最终位置 定位模式 定位模式决定了元素的定位方式,它通过c 的position属性来设置,其值可以分为四个: ...[2019/11/15]

如何在HTML中设置字体颜色,你知道这几种方式吗?

如何在HTML中设置字体颜色,你知道这几种方式吗?

color设置字体颜色 在color设置字体颜色之前,我们首先了解color在CSS中有几种取值方式,一共有4种方式,若有不全还请在评论区告知谢谢,4种方式如下: 十六进制、十进制、 英文单词、十六进制的缩写。 现在让我们进入字体颜色实践,笔者以嵌入式的形式,将cla 属性值为.box中...[2019/11/15]

CSS设置文本的水平对齐方向

介绍 在CSS中text-align属性有3种值,如下:left左、center中、right右。 由于简单我就不再多的介绍了直接进入text-align属性实践了,如果大家是新手自己一定要去实践哈,运行结果图就不进行展示了,大家自己动动手哈。 左代码块 <!DOCTY...[2019/11/15]

HTML连载50-伪元素选择器、清除浮动方式五 - 心悦君兮君不知-睿

HTML连载50-伪元素选择器、清除浮动方式五 - 心悦君兮君不知-睿

一、伪元素选择器 1.什么是伪元素选择器 伪元素选择器作用给指定标签的内容前面添加一个子元素,或者给指定标签的内容后面添加一个子元素。 2.格式:   标签名称::before{ 属性名称:值; }     给指定标签的内容前...[2019/11/15]

HTML不换行,多余用省略号代替

HTML不换行,多余用省略号代替

  最主要的c 样式:   white-space: nowrap;   overflow: hidden;   text-overflow: ellipsis;   例子: 1 <!DOCTYPE html> 2 <html lang="en">...[2019/11/15]

2D变形CSS3 transform---移动 translate(x, y), 缩放 scale(x, y), 旋转 rotate(deg), transform-origin, 倾斜 skew(deg, deg)

transform是CSS3中具有颠覆性的特征之一,可以实现元素的位移、旋转、倾斜、缩放,甚至支持矩阵方式,配合过渡和即将学习的动画知识,可以取代大量之前只能靠Flash才可以实现的效果。 变形转换 transform transform 变换 变形的意思 《 transformers ...[2019/11/14]

3D变形 CSS3 transform---rotateX(), rotateY(), rotateZ(), 透视(perspective)

2d x y 3d x y z 左手坐标系 伸出左手,让拇指和食指成“L”形,大拇指向右,食指向上,中指指向前方。这样我们就建立了一个左手坐标系,拇指、食指和中指分别代表X、Y、Z轴的正方向。如下图   CSS3中的3D坐标系与上述的3D坐标...[2019/11/14]

CSS揭秘-半透明边框与多重边框

场景一: 实现半透明边框: 由于CSS样式的默认行为,背景色的渲染范围是 content+padding+border。 半透明边框被主调色影响, 实现的效果为   解决方案: 使用background-clip 属性规定背景的绘制区域,使得绘制区域仅限制...[2019/11/14]

CSS3 新增选择器

CSS3 新增选择器

CSS3 新增选择器 结构(位置)伪类选择器(CSS3) :first-child :选取属于其父元素的首个子元素的指定选择器 :last-child :选取属于其父元素的最后一个子元素的指定选择器 :nth-child(n) : 匹配属于其父元素的第 N 个子元素,不论元素的类型 :n...[2019/11/14]

day 45

目录 form表单(**************) 参数 action method select标签 下拉框 textarea标签 ...[2019/11/14]

&lt;深圳千锋学习&gt;day01

2019.11.11     深圳千锋H5前端学习笔记 原文链接:http: www.cnblogs.com/haccer/p/11853065.html[2019/11/14]

JavaWeb第二天--CSS

JavaWeb第二天--CSS

CSS CSS简述 CSS是什么?有什么作用? CSS(Cascading Style Sheets):层叠样式表。 CSS通常称为CSS样式或层叠样式表。主要用于设置HTML页面中的文本内容(字体、大小、对齐方式等)、图片的外形(宽度、边框样式、边距等)以及版式的布局等外观显示...[2019/11/14]

前端之css(一)

目录 什么是c 注释 CSS三种引入方式 基本选择器 元素选择器 id选择器 类选择器 通用选择器 ...[2019/11/14]

CSS尺寸样式属性

尺寸样式属性介绍 属性 值 含义 height auto:自动,浏览器会自动计算高度length:使用px定义高度%:基于包含它的块级对象的百分比高度 设置元素高度 width 同上 设置元素的宽度 height属性和width属性 接下来让我们进入height...[2019/11/14]

HTML连载49-清除浮动的第三种方式(内外墙法) - 心悦君兮君不知-睿

一、清除浮动的第三种方式 1.隔墙法有两种?如下:外墙法和内墙法?。? 2.外墙法 (1)在两个盒子中间添加一个额外的块级元素 (2)给这个额外添加的块级元素设置:clear:both;属性 注意点:外墙法可以让第二个盒子使用margin-top属性 但是不能让第一个盒子使用...[2019/11/14]

rem与em的使用和区别详解【转】

目录 最大的问题是 主要区别 ?rem 单位如何转换为像素值 ?em 单位如何转换为像素值 Em 单位的遗传效果 Em 继承的例子 ...[2019/11/13]

css实现流程导航效果(三种方法)_CSS教程_CSS

css实现流程导航效果(三种方法)_CSS教程_CSS

c 实现流程导航效果,具体内容如下所示: ::tip 使用纯c 线上 流程导航效果。    本文统一采取 flex 布局 ,你也可以采用其他布局实现,核心原理不变 :::   ## 方法一 利用裁剪  该方法IE下不支持 利用裁剪 cl...[2019/11/13]

网站优化

1、head部分代码规范化head部分代码是搜索引擎爬行网站的入口部分,将网站的代码规范化,建立起网站独一无二的head部分。2、使用div+c 布局网页大多数网页都在用div+c 另外,一些网站会使用外部文件,将c 和js放在外部文件中,页面html中只要放一行代码调用就可以了,3、c...[2019/11/13]

css之纯css实现流程导航效果

css之纯css实现流程导航效果

:::tip 使用纯c 线上 流程导航效果。     本文统一采取 flex 布局 ,你也可以采用其他布局实现,核心原理不变 :::   ## 方法一 利用裁剪 &n...[2019/11/13]

用canvas写一个简易画图工具

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head>...[2019/11/13]

前端之html

目录 什么是前端 前端基础 前端必备知识点 软件开发架构 web服务的本质 请求方式 HTTP协议 是什...[2019/11/13]

推荐一款酷炫闪烁的告警按钮

效果如下:   代码如下(点击可展开查看源码): <!DOCTYPE html> <html xmlns="http: www.w3.org/1999/xhtml"> <head> <meta http-equiv="Con...[2019/11/13]

打开文件报“EFailed to load resource: net::ERR_FILE_NOT_FOUND”错误

类似这样:   引入文件的路径错误   原文链接:http: www.cnblogs.com/yixiongqiang/p/11842733.html[2019/11/13]

小程序如何实现rem

最近在学习小程序,要把html的代码转换成小程序界面,其中就遇到了rem的转换问题,但小程序不太兼容rem,不是不能用rem,而是没办法设置根元素的font-size,因为rem是相对于根元素的font-size,而小程序的根元素font-size一直是16px。既然我设置了page{ ...[2019/11/13]

day 42

目录 前端 什么是前端 什么是后端 web服务的本质 请求方式 HTTP协议 1.四大特性 ...[2019/11/13]

JavaWeb第一天--HTML

HTML HTML简介 HTML(Hyper TextMarkupLanguage) 超文本标记语言。 超文本: 超越了文本仅仅展示信息的功能范畴,泛指:图片、有样式的文字、超链接。 标记: 标签。 语言: 工具。 HTML是由标签所组成的语言,能展示超文本的效果。 HTML的...[2019/11/13]

85
2
记录数:2042 页数:1/4112345678910下一页尾页
加载更多
 友情链接: NPS  问卷模板