你的位置:首页 > 网页设计
HTML语言中img标签的alt属性和title属性的作用与区别
alt属性是在你的图片因为某种原因不能加载时在页面显示的提示信息,它会直接输出在原本加载图片的地方,而title属性是在你鼠标悬停在该图片上时显示一个小提示,鼠标离开就没有了,有点类似jQuery的hover,你可以自己试试,另外,HTML的绝大多数标签都支持title属性,ti ...
行内元素和块级元素的区别
一、行内元素和块级元素的区别  1、 行内元素不会占据整行,在一条直线上排列,都是同一行,水平方向排列;    块级元素会占据一行,垂直方向排列。  2、 块级元素可以包含行内元素和块级元素;行内元素不能包含块级元素。  3、 行内元素与块级元素属性的不同,主要是盒模型属性上,行 ...
bootstrap在ie8下,兼容媒体查询
最近使用bootstrap做网站的时候发现,在ie8下的媒体查询一直失效:后来解决了,做如下记录:1、必须运行在服务器下2、hack 条件语法,如下: <!--[if lte ie 9]> <script src="js/html5shiv.m ...
从零开始的H5生活——第一周
作为一个新手,要从头学习Html编程语言,需要从最基础的开始。有耐心慢慢来,很容易就看懂了。我所使用的编程软件是Hbuilder。1.Html文档结构 包括head和body两部分 <!DOCTYPE html><html> <head> ...
学习有关浮动和BFC的整理转述
前言:这是笔者学习之后自己的理解与整理。如果有错误或者疑问的地方,请大家指正,我会持续更新! 文档流的概念:html中block块元素默认是单独占据一行的,从上到下排列,也就是我们说的文档流;脱离文档流的概念:A元素定义了float属性之后,就会"浮"起来 ...
CSS学习总结:浮动、定位、父容器塌陷问题
怎么说呢,从接触前端起,到现在已经有三个月了,这么长时间的学习呢,我的水平依然一般,前几天参加了IFE2017,下面总结一下对CSS中浮动、定位、分列布局、父容器塌陷问题的一些心得。  首先,浮动和定位是CSS中布局的基础,通过浮动和定位,可以实现对每一个盒模型精确到像素级别的控 ...
html实现 页面禁止右键 禁止复制 禁止图片拖动 禁止复制和剪切
众所周知,一般的屏蔽的方法是用JS来编写的脚本,但是也可以直接通过修改网页属性的方法来屏蔽右键 禁止复制。 禁止右键 oncontextmenu="return false" 禁止复制和剪切:oncopy="return false;&q ...
零基础学习HTML5
2017-02-27 00:00:27

零基础学习HTML5

HTML5在近几年异常火热,因其功能强大、灵活多变等特点而被追捧。这篇博客是我跟随老师学习所的到的知识,从入门到精通需要的是坚持和系统地学习。让我们开始吧! HTML5的基本结构<!DOCTYPE html><html> <head> ...
跨专业学习编程的苦逼生活 QWQ嘤嘤嘤(第一周)
一串串小小的代码,竟然可以做出辣么多的东西,彻底颠覆了我的世界观、人生观、价值观。话不多说,一个例子证明一切>>>><!DOCTYPE html><html> <head> <meta charset=&q ...
HTML5学完就去浪迹天涯的我...
初涉H5的学习,完全萌新一枚,每天虽然疲惫却真的前所未有的充实,不敢有一点懈怠,真的不想时间白白浪费。到今天为止,会了简单的表单制作,还有一点点小小的成就感,多的不说了,下面展示下我这一周的学习笔记吧!再贴上我自己做的小表单!<!DOCTYPE html><ht ...
HTML5 File接口(在web页面上使用文件)
File接口提供了与文件相关的信息,并且运行JavaScript在web页面上去访问文件中的内容。File对象来自于用户使用input标签选择文件返回的FileList对象,来自于拖放操作的DataTransfer对象。File对象是一种特殊的Blob,它能够在任何能够使用Blo ...
小白学习H5从入门到放弃
话不多说直接进入主题:1.什么是HTML语言HTML5是用于取代1999年所制定的 HTML 4.01 和 XHTML 1.0 标准的 HTML 标准版本,现在仍处于发展阶段,但大部分浏览器已经支持某些 HTML5 技术。HTML 5有两大特点:首先,强化了 Web 网页的表现性 ...
浏览器兼容问题【转】
2017-02-27 00:00:17

浏览器兼容问题【转】

1 ie6.0横向margin加倍产生因素:块属性、float、有横向margin。解决方法:display:inline;2 ie6.0下默认有行高解决方法:overflow:hidden;或font-size:0;或line-height:xx px;3 在各个浏览器下img ...
html5常用基本标签
2017-02-26 12:00:15

html5常用基本标签

一、Html的基本结构:<!DOCTYPE html><html><head><meta charset=utf-8"><title></title></head><body ...
学习盒模型的整理转述
2017-02-26 12:00:09

学习盒模型的整理转述

前言:这是笔者学习之后自己的理解与整理。如果有错误或者疑问的地方,请大家指正,我会持续更新!1. css盒模型有标准盒模型和IE盒模型,结构是:content、padding、border、margin。css3有个box-sizing属性,设置用哪种盒模型;box-sizing ...
响应式网站的优点和缺点
优点:一、减少工作量 1、网站、设计、代码、内容都只需要一份 2、多出来的工作量只是JS脚本、CSS样式做一些改动二、节省时间,互联网领域,时间最重要,有时候一个项目发布的晚了,就会失去市场三、每个设备都能得到正确的设计。市场上的不同设备,甚至未来出现的新 ...
移动端(H5)弹框组件
2017-02-26 00:00:29

移动端(H5)弹框组件

俗话说的好,框架是服务与大家的,包含的功能比较多,代码多。在现在追求速度的年代。应该根据自己的需求去封装自己所需要的组件。下边就给大家介绍一下自己封装的一个小弹框组件,不依赖与jQuery,代码少,适用于一般移动端小项目。这个插件名称:MobileUi包含功能:弹框,正在加载,t ...
前端学习路线
2017-02-26 00:00:27

前端学习路线

第一部分 HTML第一章 职业规划和前景职业方向规划定位:web前端开发工程师web网站架构师自己创业转岗管理或其他web前端开发的前景展望:未来IT行业企业需求最多的人才结合最新的html5抢占移动端的市场自己创业做老板随着互联网的普及web开发成为企业的宠儿和核心web职业发 ...
CSS属性之border
2017-02-26 00:00:25

CSS属性之border

css的border属性相信大家都不陌生了,就是给元素加个边框嘛,在不同的盒模型下,会给元素的宽高带来怎样的影响,相信大家也都很熟悉了,这里就不再赘述,只说说大家平时没有怎么留意的东西。0.border-color与color大家平时使用border属性的时候,通常应该是直接写b ...
HTML 部分常用属性
2017-02-26 00:00:22

HTML 部分常用属性

-html概念:hyper Text Markup Language (超文本标记语言) Html标签分类: 1 双标签 2 单标签Html标签之间的关系: 1 嵌套关系 2 并列 ...
前端页面隐藏元素
2017-02-26 00:00:16

前端页面隐藏元素

display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别:display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失。visible:hidden--- 使对象在网页上不可见,但该对象在网页上扔占据着空间。例子 ...
关于左边固定,右边自适应布局的响应式布局写法
关于响应式布局现才接触到,虽然代码很简单,但是对基础要求还是有一些。1.left设置position:absolute和width:70px;那么右边用margin-left:70px;因为是响应式的我用jquery设置了一下高度(不用jquery,直接设置高度为100%好像不行 ...
HTML5 DragEvent
2017-02-26 00:00:14

HTML5 DragEvent

DragEvent是一个表示drag和drop交互的DOM event接口。用户通过将指针设备(如:鼠标)放在目标的表面开始拖动,然后拖动指针到一个新的位置(如其他DOM元素)。应用程序自动的解析拖放交互。DragEvent接口从mouseEvent和Event那儿继承属性。Ev ...
css垂直居中的整理
2017-02-25 12:00:14

css垂直居中的整理

前言:这是笔者学习之后自己的理解与整理。如果有错误或者疑问的地方,请大家指正,我会持续更新!垂直居中用到的地方有很多,解决的方法也有很多。已知元素宽度 可以用position定位 + margin负值的方法绝对定位 + 4个方向全部0px + margin:auto 可以做到基于 ...
css常用属性总结之 id和class的区别,使用类还是ID?
前面两篇文章我们分别谈到了class和id的相关知识和如何使用,但是在实际项目中,我们该如何抉择,class还是id?先回顾下两者的区别吧!1.id具有唯一性,class具有普遍性,所以一个页面同一个id只能使用一次,而class可以被无限制使用。2.id的优先级要高于class ...
对原型链的理解 语言表达能力不好  直接用代码,哈
分享一下 我对原型和原型链的理解 原型对象: function People(nameValue,ageValue,fondValue) { ...
你必须要知道的几个CSS技巧
有些经典的CSS技巧,我们还是需要记住的,这样可以节省我们大量的时间,下面零度就为大家推荐几个比较好的CSS技巧:1、在不同页面上使用同样的导航代码许多网页上都有导航菜单,当进入某页时,菜单上相应这一项就应该变灰,而其他页亮起来。一般要实现这个效果,需要写程序或专门为每一页做设计 ...
body全屏
2017-02-25 00:00:31

body全屏

html, body { height: 100%;} ...
伪类元素实现可伸缩时间轴
需求:需要实现纵向列表左边的一条时间轴,时间轴中间除穿插具体的时间节点外不可间断,单击右边信息盒子里的图标,向下弹出子盒子并撑开列表,时间轴相应的延长。再单击图标,子盒子隐藏,时间轴收缩。看图来直观的了解一下这个需求,为便于观察,使用了醒目的红色线段和紫色边框如图a、图b所示: ...
归纳篇(一)CSS的position定位和float浮动
近期会更新一系列博客,对基础知识再度做个巩固和梳理。一、position定位(一):position的属性  1.absolute:生成绝对定位的元素,相对于最近一级定位不是static的父元素来进行定位;  2.relative:生成相对定位的元素,相对于其所在普通的文档流位置 ...
前端框架汇总
2017-02-24 00:00:32

前端框架汇总

UI:  iview:https://www.iviewui.com/ 基于Vue.js框架开发的UI框架  nfine:http://www.nfine.cn 基于asp.net mvc bootstrap 现成cms系统 ...
jQuery中.bind() .live() .delegate() .on()的区别
bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数$("a").bind("click",function(){alert("ok");});live(type,[data],fn) 给所 ...
HTML格式化
2017-02-24 00:00:26

HTML格式化

<b>    定义粗体文本<big>   定义大号字体(已废除)<em>   定义着重文字<i>     定义斜体字<small> 定义小号字<strong> 定义加重语气 ...
html4与html5的区别及html5的一些新特性
区别1.html5语法的改变HTML5简化了很多细微的语法,例如:1.1doctype的声明;html4:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "h ...
fixed在手机端的bug
2017-02-24 00:00:23

fixed在手机端的bug

一、带input的fixed在ios下失效在ios下,一个页面如果有fixed浮层,并且浮层里面有input,那么当input focused的时候,fiexed层的位置就会错乱。如图: 例子:http://demo.zhangruojun.com/static/pag ...
如何在页面上输出html标签:符号实体
用符号实体来表示特殊字符,比如 "<" 代表 "<",">" 代表 ">","&amp;" 代表 "&"。输入 < ...
a标签链接到当前页内指定位置
<a name="me">hello</a><br/><br/><br/><br/><br/><br/><br/><br/><br/& ...
Html+CSS input type=file 文件类型限制属性 accept (HTML 5)
网页上添加一个input file HTML控件:1<input id="File1" type="file" />  默认是这样的,所有文件类型都会显示出来,如果想限制它只显示我们设定的文件类型呢,比如“word“,”ex ...
前端工具Sublime Text 3 的安装与使用
Sublime Text 是一个代码编辑器,被称为前端开发的神器。Sublime Text 3下载地址:http://www.sublimetext.com/3安装完毕之后如下:若要方便地管理插件,我们需要安装插件管理器,步骤如下:1. “Ctrl+‘” 调出Console2. ...
立体骰子(css3和js)
2017-02-24 00:00:16

立体骰子(css3和js)

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> < ...
使用C3的一些新属性绘制谷歌浏览器的图标
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> < ...
c3和js写的切割轮播图  喜欢宋仲基的妹子汉子们来,观看效果需要引入jQuery^^
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> < ...
BootstrapBootbox居中
2017-02-23 12:00:25

BootstrapBootbox居中

1 /* 模态框居中样式 */ 2 .bootbox-container { 3 position: fixed; 4 top: 0; 5 right: 0; 6 bottom: 0; 7 left: 0; 8 z-index: 1049; 9 ove ...
Framework7初始化
2017-02-23 12:00:18

Framework7初始化

1 /** 2 * Framework7初始化 3 * 需引用jQuery 4 */ 5 6 /*---------------------------函数---------------------------*/ 7 8 /** 9 * 为空判断 10 * @par ...
Framework7链接地址
2017-02-23 12:00:13

Framework7链接地址

中文文档地址: http://docs.framework7.cniOS体验版本:http://ios.framework7.cnAndroid体验版本:http://material.framework7.cnF7 图标:http://icons.framework7.cn ...
CSS学习总结
2017-02-23 12:00:10

CSS学习总结

笔者花业余时间,学习了CSS内容,主要是参考了王福朋博客(http://www.cnblogs.com/wangfupeng1988/tag/css/)及张鑫旭的博客中CSS部分的内容,由于笔者非前端专业人士,不能像张鑫旭大神一样剖析CSS的属性机制,目前只能以查看及学习后,将自 ...
HTML5自定义播放器(简式)
这是html5中自带的标签<video></video>,非常实用。使用这个标签有诸多好处(好处我就不多说了,详见谷歌、必应、百度)。这个html5播放器的主体就是<video></video>标签的属性包括:·src : ...
html4与html5的区别
2017-02-23 00:00:31

html4与html5的区别

1.html5语法的改变HTML5简化了很多细微的语法,例如:1.1doctype的声明;html4:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "htt ...
新手学H5——第一周
2017-02-23 00:00:30

新手学H5——第一周

作为一个新手,要从头学习Html编程语言,需要从最基础的开始。我所使用的编程软件是Hbuilder。1.Html文档结构 包括head和body两部分 <!DOCTYPE html><html> <head> <meta ch ...
HTML5动画(二):Canvas 实现圆形进度条并显示数字百分比
实现效果1.首先创建html代码<canvas id="canvas" width="500" height="500" style="background:#000;"></can ...
weui
2017-02-23 00:00:26

weui

最近在学习weui这个框架,做了一些小的试验,发现weui-switch控件直接提交不能获取到表单信息,在segmentfault上发现也有人提了这个问题,有人说可以设置一个隐含标签来捕获开关的状态,试了一下,确实可以,把我自己的解决方法写下来如下: weui这个switch ...
【MUI框架】学习笔记整理 Day 1
MUI 框架之 【原生UI】(1)accordion(折叠面板)由二级列表演化而来1 <ul class="mui-table-view">2   <li class="mui-table-view-cell mui-collaps ...
浏览器兼容问题与解决方法
浏览器兼容问题是指,不同厂商开发的浏览器针对同一段代码的不同解析,造成页面展示效果出现差异的情况,很多时候为了追求显示效果的一直,前端开发人员就要针对不同兼容问题应用相应的方法处理,达到效果一致的目的。下面这些是平时开发过程中遇到的,做个汇总,方便查阅。1、<!DOCTYP ...
大疆官网的视频加载动画 by css3 animation
前段时间,访问大疆官网的时候发现有个效果很不错的预加载动画,就不要脸的顺手拿过来了。有兴趣的童鞋可以拷走,记得要感谢大疆的前端工程师傅。用的时候得注意下兼容性,现代浏览器chrome、ff、edge以及移动端都是可以的,ie 9以下的就不行了。代码如下:  css样式.spinn ...
css中的三种基本定位机制
css中的三种基本定位机制  a.普通文档流  b.定位:相对定位      绝对定位      固定定位  c.浮动1.普通流中,元素位置由文档顺序和元素性质决定,块级元素从上到下依次排列,框之间的垂直距离由框的垂直margin值计算得到,行内元素在一行中水平布置2.相对定位看 ...
css常用属性初总结第一弹:id和class选择器
前言:这是我第二次写博客,记录自己所学的点点滴滴,希望大家一起共勉!说到选择器大家都不陌生,估计用的最多的还是id选择器和类选择器,至于其他的选择器,今天在这里我避而不谈。类选择器:将html元素取一个响亮的名字,用class来标记,就可以使用类选择器了,如<p >这 ...
浏览器缓存控制
2017-02-23 00:00:22

浏览器缓存控制

浏览器缓存控制Last-Modified/ If-Modified-Since在浏览器第一次请求某一个URL时,服务器端的返回状态码200,内容是客户端请求的资源,同时有一个Last-Modified的属性标记此文件在服务器端最后被修改的时间。Last-Modified格式类 ...
HTML5 ruby注释标签
2017-02-23 00:00:22

HTML5 ruby注释标签

今天学了HTML5的ruby标签,觉得挺有趣的,来记录一下。ruby可以作注释标签,内部有rp和rt标签。<ruby> 标记定义注释或音标。<rp>  告诉那些不支持ruby元素的浏览器该如何显示。<rt> ...
关于font
2017-02-22 12:00:20

关于font

先来看几个大的电商网站字体设置:淘宝网  font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;京东  font: 12px/1.5 Microsoft YaHei,tahoma,ar ...
如何优雅的选择字体(font
大家都知道,在不同操作系统、不同游览器里面默认显示的字体是不一样的,并且相同字体在不同操作系统里面渲染的效果也不尽相同,那么如何设置字体显示效果会比较好呢?下面我们逐步的分析一下:一、首先我们看看各平台的默认字体情况1、Window下:宋体(SimSun):Win下大部分游览器的 ...
第一页下一页12345678910下10页末页第1/194页,总共:11627条数据