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

【WEB基础】HTML & CSS 基础入门(3)段落及文本

写在前面:CSS选择器 网页要显示很多内容,想要为每个内容设置不同的样式,我们就得首先选中要设置样式的内容,CSS选择器就是指明该样式是针对HTML里哪一个元素的。简单的例子,网页上有几段文字,我们想把第一段文字调成红色的,在用CSS写完红色文字样式后,是不是得指明该红色文字样式是针对第一段文字...[2019/5/22]

Width Height -- (1)

Width和Height应该是我们学习CSS时,最先接触到的属性了,一宽一高。 我们知道页面当中的标签分为块级元素和行内元素,它们最大的区别就在于,块级元素可以设置宽高,行内元素不能设置宽高。 举例说明,我们块级元素、行内元素各举一例 块级元素我们以div为例,div标签是我们编写页面...[2019/5/22]

移动端布局之动态rem的实现_CSS布局实例_CSS

移动端布局之动态rem的实现_CSS布局实例_CSS

动态rem 1. 首先我们先介绍当下的长度单位 px 像素 em 一个M的宽度 / 一个汉字的宽度 1em == 自身的 font-size rem 全称 root em 是根元素(html)的 font-size vh 全称 viewport height 100vh == ...[2019/5/22]

【WEB基础】HTML & CSS 基础入门(2)选取工具:VS2019安装使用

【WEB基础】HTML & CSS 基础入门(2)选取工具:VS2019安装使用

前面 子曰“工欲善其事,必先利其器”。开始编写HTML代码前,我们该选择一款编辑工具,实际上,HTML作为标记语言,我们甚至可以直接用记事本来编写HTML代码,但记事本实在弱爆了。这里推荐使用Visual Studio,当然,你也可以选择其它你习惯使用的编辑器,甚至可以使...[2019/5/21]

【WEB基础】HTML & CSS 基础入门(1)初识

前面 我们每天都在浏览着网络上丰富多彩的页面,那么在网页中所呈现出的绚丽多彩的内容是怎么设计出来的呢?我们想要自己设计一个页面又该如何来做呢?对于刚刚接触网页设计的小伙伴来说,看到网页背后的一堆符号和代码,是不是会感到有些凌乱。“看这里、看这里”,其实HTML并不复杂,严...[2019/5/21]

手把手教你grid布局 - Cynthia-milk

概述 目前c 布局方案中,网格布局可以算得上是最强大的布局方案了。它可以将网页分为一个个网格,然后利用这些网格组合做出各种各样的布局。 基本概念 在学习grid布局之前,我们需要了解一些基本概念 1.容器和项目 采用网格布局的区域,称为“容器”。容器内部的采用...[2019/5/21]

bootstrap3-javascript插件(模态框)- 慕课笔记

bootstrap支持的js插件 概览 bootstrap中的JavaScript插件: 插件名称 定义文件 动画过滤 transition.js 模态框 modal.js 下拉菜单 dropdown.js 滚动侦测 scrollspy.js 选项卡 tab.js ...[2019/5/21]

【转】Flex 布局教程:语法篇

【转】Flex 布局教程:语法篇

作者: 阮一峰 日期: 2015年7月10日 网页布局(layout)是 CSS 的一个重点应用。 布局的传统解决方案,基于盒状模型,依赖 display 属性 + position属性 + float属性。它对于那些特殊布局非常不方便,比如,垂直居中就不容易实现。 ...[2019/5/20]

display:flex; justify-content:space-between; 最后一行显示内容无法靠左显示

给父元素添加同每行展示列数一样(展示列表最多的)的子元素。 子元素设置样式: width:同子元素一样的width ; height:0; 原文链接:http: www.cnblogs.com/zsara/p/10881142.html[2019/5/20]

博客园美化之旅第一天(CSS图层关系,背景相关设置,字体相关设置)

博客园美化之旅第一天 1.修改后的效果图 2.修改中间学习到的 一.图层样式的关系 引用https: www.cnblogs.com/cs_net/article 1930810.html, 个人总结越具体的描述样式所在的位置优先级别越高,外层优先于内层,#>. 如果同个...[2019/5/20]

html/css实现聊天布局

效果图 项目结构 html代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <link rel="stylesh...[2019/5/20]

为什么有时候Css样式表某个属性引用不成功?

 首次使用博客,很多东西都在探索,第一篇文章也不知道发布点什么,就随便写写,是在word里面写的,也懒得排版,将就这用吧。 闲着没事找了酷狗的API写了个简单的静态网页,完成了搜索,展示,播放功能。就想着给搜索框写一个搜索推荐的下拉列表框,思路很明确,不写了画图 代码如下 ...[2019/5/20]

自学前端第三天

简历第三天 简历的CSS文件 body{ font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; font-size: 18px; font-weig...[2019/5/20]

前端常见的适配方式的方法

作为一个真正的前端工作者适配是一个老生常谈的问题,那么今天给大家总结一下在工作当中常用做适配的方式。 一、固定布局(pc端)(静态布局) 以像素作为页面的基本单位,不管设备和浏览器宽度,只设计一套尺寸 二、根据不同根据不同的分辨率,加载不同的CSS样式文件(可切换的固定布局)自适应布局...[2019/5/20]

前端之CSS2

CSS盒子模型 CSS盒子模型介绍 盒子模型解释 元素在页面中显示成一个方块,类似一个盒子,CSS盒子模型就是使用现实中盒子来做比喻,帮助我们设置元素对应的样式。 盒子模型示意图如下: 把元素叫做盒子,设置对应的样式分别为:盒子的边框(border)、盒子内的内容和边框之间的间距...[2019/5/20]

导航条

bootstrap中的导航条 一、和导航的区别 导航条比导航多了一个条字 直接上图 导航: 导航条: 简单文字描述: 由两张图看出,导航内容比较简单,而导航条可以包含导航及其他元素,如表单,搜索框等,并且通常导航条会有一个区别于页面的背景色。 二、在页面中定义导航条 方法: 为父容器...[2019/5/20]

详解CSS Masking模块之Clipping_CSS教程_CSS

最近业务中需要实现一些镂空的效果。看到这些效果我最初想到的是通过CSS的 mask 和 clip-path 来实现,甚至还想结合SVG相关的特性。为了验证自己的一些想法,开始着手撸码,但问题来了,在撸码的过程中,我发现自己对于 mask 的相关特性理解的还不够透彻。因此重新阅读 CSS Maski...[2019/5/20]

纯css实现动态边框的示例代码_CSS教程_CSS

背景 这几天工作中遇到一个交互需求,要求实现一个效果,当鼠标移入一个元素的时候,元素出现一个动态的边框,如图:   动态边框 思路 看到这个效果,我首先想到的是设置元素的border属性,可惜border不能设置长度,无法实现动效。另外一种实现思路是添加四个div来分...[2019/5/20]

Django extend(继承)模板标签

在 views.py 上修改 ... def ordered(req): return render(req, "ordered.html") def shopping_car(req): return render(req, "shoppin...[2019/5/17]

前端之CSS1

前端之CSS1

CSS基本语法和引入方式   CSS介绍 为了让网页元素的样式更加丰富,也为了让网页的内容和样式能拆分开,CSS由此思想而诞生,CSS是 Cascading Style Sheets 的首字母缩写,意思是层叠样式表。有了CSS,html中大部分表现样式的标签就废弃不用了,html...[2019/5/17]

CSS实现对话框小尾巴功能_CSS教程_CSS

CSS实现对话框小尾巴功能_CSS教程_CSS

对话框小尾巴,估计大家在实际开发中应该经常遇到过,省事点的就是叫设计小姐姐给切个带小尾巴的背景图,那不省事的呢? 边框的魔法 在c 3出来之前,若通过c 来实现小尾巴效果,可能使用最多的是通过如下的hack方式: <div cla ="tooltip&qu...[2019/5/17]

web容器如何自适应视口大小_CSS教程_CSS

web容器如何自适应视口大小_CSS教程_CSS

前言 在前端生涯上,经常会遇到需要容器自适应视口高度这种情况,本文将介绍我能想到的解决这个问题的方案。 基础知识 html元素的高度默认是auto(被内容自动撑开),宽度默认是100%(等于浏览器可视区域宽度),没有margin和padding; body元素的高度默认是auto,...[2019/5/17]

vue项目中使用scss的方法步骤

一 概述 随着sa le 等c 预处理器的出现,编写c 变的越来越有乐趣。所以现在越来越多的人在项目中喜欢使用sc 或者le 。(我自己就是一个)。由于最近在写一个vue项目。所以就把写项目期间每天的一些知识点写在博客里。所以最近的博客应该都会和vue有关。今天要和大家分享的就是如何在vue项...[2019/5/17]

react框架下,在页面内加载显示PDF文件,关于react-pdf-js的使用注意事项 - CN-无忧

react框架下,在页面内加载显示PDF文件,关于react-pdf-js的使用注意事项    之前做了一个需求,在注册账号的时候,让用户同意服务条款, 服务条款是一个PDF文件, 这就需要在react内加载PDF文件的插件了,今天特地做一个总结 我用的版本是4.0.1 然后在页面内引入...[2019/5/16]

元素垂直居中

方法一:容器设置height和line-height值相等 1 c 2 .container{ 3 width: 100px; 4 height: 100px; 5 line-height: 100px; 6...[2019/5/16]

3d爱心代码 - 如期-而至

3d爱心代码 - 如期-而至

<!doctype html> <html> <head> <meta charset="UTF-8"> <title>3daixin</title> <style type="text/c "&g...[2019/5/16]

移动端的text-overflow多行文本溢出显示省略号(…)_CSS教程_CSS

大家应该都知道用text-overflow:ellipsis属性来实现单行文本的溢出显示省略号(…)。当然部分浏览器还需要加宽度width属性。 overflow: hidden; text-overflow: ellipsis; white-space: n...[2019/5/16]

Document Structure - Aha-Best

Document Structure <!DOCTYPE html> <html> <head> ...... ...... ...... </head> ...[2019/5/15]

HBuilderx 模拟器调试设置

模拟器名称    连接默认端口 夜神安卓模拟器夜神安卓模拟器     62001 逍遥安卓模拟器逍遥安卓模拟器     21503 BlueStacks(蓝叠安卓模拟器)BlueStacks(蓝叠安卓模拟器)...[2019/5/15]

前端之HTML

HTML概述 前端开发概述 前端开发也叫web前端开发,它指的是基于web的互联网产品的页面(界面)开发以及功能开发。互联网产品是指网站为满足用户需求而创建的用于运营的功能及服务。前端开发需要的技术包括:photoshop,html,c ,javascript,js库和框架。 html概述 ...[2019/5/15]

CSS实现两个球相交的粘粘效果示例代码_CSS教程_CSS

这是一个纯粹利用CSS所做出来的效果,这个效果说穿了就是一个图像处理的原理,做法跟Photoshop里头的几乎一模一样,只是一个用图层和色版来制作,一个则是用CSS(把div当成图层思考就好了)。 从PhotoShop开始 一开始我们来玩Photoshop,会比直接写CSS来得容易理解(没...[2019/5/15]

CSS实现垂直居中的几种方法小结_CSS教程_CSS

CSS实现垂直居中的几种方法小结_CSS教程_CSS

在前端布局过程中,我们实现水平居中比较简单,一般通过margin:0 auto;和父元素 text-align: center;就能实现。但要实现垂直居中就没有那么容易,下面向大家分享下我工作中实现垂直居中的几种方法。 1、line-height等于hieght/只设line-height ...[2019/5/15]

CSS -webkit-box-orient: vertical属性编译后丢失问题详解_CSS教程_CSS

一、起因 需求要求展示两行,多余的文字用三个点替代,于是用了这几个不太规范的属性 display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; 后来发现代码里写的好好的,一到页面上居...[2019/5/15]

css做个波浪悬浮球的实现方法_CSS教程_CSS

最近公司项目有个需求是在网页上操作虚拟机,emmm...操作就操作吧,谁让是领导提的,咱也不知道,咱也不敢问啊....咋办?搞吧,爬了n多个坑才终于把虚拟机功能给引入到项目中,看着熟悉的Linux操作窗口,都别拦我,让我装一会* 领导看了十分满意,然后说...我看电脑上都有那个悬浮球,我们这也...[2019/5/15]

前端压缩上传图片

1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="UTF-8"> 6 <title>前端压缩上传图片</title&...[2019/5/14]

css-博客样式初体验

c 学习一周后,写了个基础博客样式。 样式是出来了,但是在写的过程中感觉c 写的杂乱无章,可能是写的太少了吧,条例不是很清除,只是在写的过程 中一个点一个点的套,感觉样式出来即可,没有做到由全局出发考虑再到局部,再到细节的考虑。 总共耗时4个小时,写的时候 html 部分头脑很清晰,可以做...[2019/5/14]

BFC

BFC(Block  formatting  context)块级格式化上下文,是一个独立的渲染区域。 一、如何触发BFC: 1、根元素(html); 2、设置float除none意外的值(left  ,right); 3、设置overflow 除vi...[2019/5/14]

HTML语义化

语义化的主要目的可以概括为用正确的标签做正确的事。 HTML语义化可以让页面的内容结构化,便于浏览器解析和搜索引擎解析,并提高代码的可维护度和可重用性。 尽可能少的使用无语义的标签<div>,多用语义化标签<header><section><foo...[2019/5/14]

解决CSS 中box-sizing与background-clip解决背景显示范围的问题_CSS教程_CSS

过去在学习CSS的时候,首要任务就是要理解“box model”,因为box model是CSS里头很重要的模型概念,描述了padding、margin、border与content的空间定位,今天的项目竟然卡在一个简单的小问题,因此就用一篇文章做个纪录提醒自己不要忘记,也...[2019/5/14]

前端面试题总结

以下面试题出自自己去各个公司面试遇到的,不乏各个大厂: 瀑布流 vuex几个常用属性 vue通过哪个js原声方法实现数据监听的 图片截取上传 懒加载和预加载 防抖动截流 flex几个属性背一下 手机端app优化 手机端调用相机webview 微信小程序 ...[2019/5/13]

前端之HTML语法及常用标签

html语法: 1.常规标记: <标记 属性=“属性值” 属性=“属性值”></标记>; 2.空标记: <标记 属性=“属性值” 属性=“属性值”/>...[2019/5/13]

前端之CSS创建的样式

CSS即层叠样式表,在创建时有以下几种样式: 1.内联样式(行内样式、行间样式):     <标记 style=“属性:属性值;”></标记> 2.内部样式(嵌入式样式):     <style type="text/c "&g...[2019/5/13]

前端之CSS语法及选择器

一、c 语法:   c 由两大部分组成:选择符和声明,声明由属性和属性值两部分组成;                    选择符{属性:属性值;属性:属性值;}   ...[2019/5/13]

为什么那么多自学WEB前端的后来都放弃了,总结起来就这些原因

目前信息化产业发展势头很好,互联网就成为了很多普通人想要涉及的行业,因为相比于传统行业,互联网行业涨薪幅度大,机会也多,所以就会大批的人想要转行来学习web前端开发。目前来讲市场上需要的web前端人员非常多,而且按照现在的势头,以后会需要更多的web前端开发人员,理由是以后每个人公司都会有自己的网...[2019/5/13]

CSS-3D动画笔记

CSS-3D动画笔记

3D 在2d的基础上添加 z 轴的变化 3D 位移:在2d的基础上添加 translateZ(),或者使用translate3d()   translateZ():以方框中心为原点,变大 3D 缩放:在2d的基础上添加 scaleZ(),或者使用scale3d()   scaleZ(...[2019/5/13]

css中background和 background-color 同时使用的优先级

给背景图片设置一个默认背景颜色,有以下两种方法: <style> .bg1{ background:url(http: debug.itxst.com/img/logo.png) red no-repeat; height:80px;width:1000%; ...[2019/5/13]

前端之CSS字体和文本类属性

    一、字体类属性:   1.字体类型:   font-family:字体1,字体2,字体3;   常用写法: font-family:"微软雅黑",Arial;   注:a) 多个字体之间用逗...[2019/5/13]

如何高效的学习WEB前端

学习专业知识,不是都靠自己顽强的意志,更多的是需要跟别人交流,重要的就是跟比你强的人交流,加一些氛围比较好的交流学习群,或者别人的一句话就能让你茅塞顿开,学技术切记不能闭门造车,学习的大忌。   5.遇到问题搞不清楚,只能百度,然后自己一团糟   遇到问题的时候,不假思索「百度」,但是很多时...[2019/5/13]

2019最新黑链代码expression:隐藏链接代码

之前有收集了一些主流的隐藏链接代码,最近又发现一种相当牛X的代码,如下: 源代码: <div style="position:absolute;left:expre ion(1-900);top:expre ion(3-999);">隐藏内容</a>&l...[2019/5/13]

Cascading Style Sheet - Aha-Best

Cascading Style Sheet           CSS(Cascading Style Sheet)即层叠样式表,简称样式表。要理解层叠样式表的概念先要理解样式的概念。样式就是对网页中的 元素...[2019/5/13]

85
2
记录数:1196 页数:1/2412345678910下一页尾页
加载更多