- 博客(150)
- 收藏
- 关注
RSS订阅原创 如何使用纯CSS创建折叠标题效果
折叠标题是向用户显示重要信息（例如特价商品和关键通知）的绝佳解决方案。许多开发人员在创建这种效果时都依赖JavaScript，但是，完全可以使用纯CSS创建更简单的折叠标头效果。折叠的标题与视差效果相似。折叠标题的背景保持固定，以便当用户向下滚动页面时，其下方的内容可以在其顶部流动。在本教程中，我们将向您展示如何创建以下折叠的标题效果：该演示包括三个部分：固定标题为黑色背景，位于...
2020-02-23 13:58:04
1011
原创 了解和使用CSS中的rem单位
什么是雷姆单位？在收听广播或音乐播放器之前，您可能遇到过“ REM”一词。与他们的音乐同伴不同，它们在深度睡眠期间被称为“快速眼动”，而CSS rem则代表“ root em”。他们不会使您失去宗教信仰，也不会相信月球上的男人。他们可以做的是帮助您实现和谐均衡的设计。根据W3C规范，一个rem单位的定义是：等于font-size根元素上的计算值。在font-size根元素的属性上指定...
2020-02-23 13:58:01
1116
原创 如何使用CSS创建易于打印的页面
“谁打印网页？”我听到你哭了！相对而言，很少有纸页可以复制。但是请考虑：打印旅行或音乐会门票复制路线方向或时间表保存副本以供离线阅读在连通性差的区域中访问信息在危险或肮脏的条件下使用数据，例如厨房或工厂输出书面注释的草稿内容打印网络收据以进行簿记向难以使用屏幕的残障人士提供文件为拒绝使用这种新奇的t-internet废话的同事打印页面。不幸的是，打印页面可能会令人沮丧：文字可能太小，...
2020-02-23 13:57:57
701
原创 web前端开发注册的HTML5常见问题
在对HTML5标记进行了快速介绍之后，您可能会想到很多问题。以下是一些可能答案的一些答案。为什么这些更改在旧版浏览器中仍然有效？为了理解为什么这不是问题，我们可以将HTML5与CSS3中添加的一些新功能进行比较，我们将在后面的章节中进行讨论。在CSS中，当添加了新功能（例如，border-radius将圆角添加到元素的属性）时，该功能也必须添加到浏览器的渲染引擎中，因此较旧的浏览器将无...
2020-02-23 13:57:54
732
原创 web前端开发基础教程之HTML5页面结构基础
现在，我们已经分解了模板的基础，让我们开始向骨头添加一些肉，并为页面提供一些结构。在本书的后面，我们将专门处理添加CSS3功能和其他HTML5优点。现在，我们将考虑在构建网站的整体布局时要使用哪些元素。在本节以及接下来的有关语义的各章中，我们将涉及很多内容。当我们使用“语义”一词时，是指给定HTML元素描述其内容含义的方式。如果回头看HTML5 Herald的屏幕截图（或在线查看网站），您...
2020-02-23 13:57:51
702
原创 如何使用HTML5自定义数据属性以及原因
为什么要使用自定义数据属性？很多时候，我们需要存储与不同DOM元素关联的信息。这些信息对于读者而言可能不是必不可少的，但是易于访问将使我们的开发人员的生活更加轻松。例如，假设您在网页上有一个不同餐厅的列表。在HTML5之前，如果您想存储有关餐厅提供的食物类型或其与访客之间的距离的信息，则应使用HTMLclass属性。如果您还需要存储餐厅id以查看用户要访问哪个餐厅，该怎么办？这是基于...
2020-02-23 13:57:47
684
原创 使用CSS网格布局放置元素的七种方法
在这里，重点将完全放在使用CSS Grid在Web上布置元素的特定方式。现在，让我们逐一检查它们。解决浏览器对网格布局的支持目前，网格布局尚未获得一致的浏览器支持。但是，截至2017年3月，默认情况下已发布了最新版本的Chrome和Firefox浏览器，均支持CSS Grid Layout。IE仍然支持旧的实现，Opera需要打开Experimental Web Platform标志，而S...
2020-02-23 13:57:43
1115
原创 使用这三个HTML缩小工具削减文件大小
管在HTML缩小的好处方面尚无明确共识，但是如果您在Google的PageSpeed Insights上测试您的网站，那么您可能会得到的部分答案是，您应该缩小HTML，CSS和JavaScript。缩小资源意味着摆脱多余的元素，也就是说，浏览器不需要这些元素即可正确处理文档。将此概念应用于HTML文档，缩小可以包括以下内容：剥离HTML注释以及内联CSS和JavaScript代码中的注...
2020-02-23 13:57:40
1472
原创 五个CSS性能工具可加速您的网站
在本文中，我将列出五个CSS性能工具，这些工具将帮助您将网站置于CSS架构上，以实现快速加载体验。为什么页面速度如此重要？快速加载的网站对于网站的成功至关重要。有研究发现支持以下观点：如果用户不得不等待甚至几秒钟才能显示Web内容，他们就会很快变得不耐烦。当这种情况在您的网站上发生时，他们的体验会明显下降，结果是您的网站访问量和转换次数减少，最终损害了您的业务。有许多因素会影响We...
2020-02-23 13:57:36
638
原创 HTML5表单：工具箱中的可靠工具
我们已经对页面的大部分进行了编码，现在您几乎了解了有关新HTML5元素及其语义的所有知识。但是，在我们开始在网站外观上进行工作（我们将在第7章中进行操作）之前，我们将快速绕过HTML5 Herald的首页以浏览注册页面。这将说明HTML5必须提供的Web形式。HTML5 Web表单引入了新的表单元素，输入类型，属性，本机验证和其他表单功能。多年来，我们在界面中一直使用许多这些功能：表单验证，组...
2020-02-23 13:45:25
584
原创 web前端基础学习入门教程之XHTML制作网页时注意的要点总结
HTML高级教程的目的是开拓HTML的优点，优化亲和力和易用性。因为HTML初级教程和HTML中级教程持使用最新HTML标准（XHTML1.0以上版本）的立场，可能某些没有读过初级和中级教程的人对这个教程的某些方面感到难以理解，这也是标准要点存在的原因。总体上，这个教程的各部分都假设你对HTML已经里外理解，并要进一步开发它的潜能。新建一个前端学习qun438905713，在群里大多数都...
2020-02-22 18:06:44
658
原创 HTML文件也能格式化硬盘
一日，忽然听朋友说，他在上网的时候，不知点击了什么东西，而将他的硬盘全部给格式化了。笔者首先的念头就是:该不会是中了那个有名的国产宏病毒"七月杀手"?不过这个宏病毒是在系统Autoexec.bat文件中加入了"deltree c:/y"，应该不会格式化整个硬盘。 曾经在某个杂志上看到过一个介绍，说什么IE浏览器可以通过执行ActiveX而把硬盘格式化，而且记得当时还公布了源代码，只是当时公布...
2020-02-22 18:05:23
621
原创 web前端学习过程中如何控制框架页内中链接的目标
要在一个框架中使用链接以打开另一个框架中的文档，您必须设置链接目标。链接的 target 属性指定在其中打开链接的内容的框架或窗口。 例如，如果您的导航条位于左框架，并且您希望链接的材料显示在右侧的主要内容框架中，则您必须将主要内容框架的名称指定为每个导航条链接的目标。当访问者单击导航链接时，将在主框架中打开指定的内容。 若要设置目标框架，请执行以下操作: 在"设计"视图中，选择...
2020-02-22 18:04:40
2353
原创 使用自定义HTML标签来进行网页设计
如果能在自己的网页中使用自定义的标签是不是很酷呢，比如用你的网站的名称、用你的网名、用你所爱的人的名字来定义HTML标签并内嵌到网页中，本文就介绍一下这方面的内容。 本文以我的网站的拼音为例来自定义HTML标签。 网站名称：网页教学网，域名缩写：webjx 首先需要在<html>标签中进行这样的申明：<html xmlns:webjx>，xmlns即xml...
2020-02-22 18:03:46
2287
原创 HTML教程：详细讲解网页中meta标记的作用
meta是用来在HTML文档中模拟HTTP协议的响应头报文。meta 标签用于网页的<head>与</head>中，meta 标签的用处很多。meta 的属性有两种：name和http-equiv。name属性主要用于描述网页，对应于content（网页内容），以便于搜索引擎机器人查找、分类（目前几乎所有的搜索引擎都使用网上机器人自动查找meta值来给网页分类）。这其中最重...
2020-02-22 18:03:02
1112
1
原创 网页教程：对Web页面元素的绝对唯一引用方法
我们知道要在Web页面中引用一个HTML元素，最简单的方法就是使用getElementById方法，或其类似的一组getElementsByXxx方法。可是这里需要注意的是，这些方法其实都不能完全绝对的唯一确定对一个元素的引用。 至于getElementsByXxx我们不说了，它本身就是getElements，很明白了，那么getElementById也不能唯一确定一个元素吗？当然是...
2020-02-22 18:02:12
1094
原创 使SWF文件强制不从浏览器读本地的缓存
每次制作含有FLASH的页面时。当FLASH更新后。都必须在IE缓存里清空一次。才能看到更新后的FLASH在页面中的效果。这让我很麻烦。解决方案： 使用以下的方法，使SWF文件强制不从浏览器读本地的缓存。或强制其SWF文件每次都去 读取最新的媒体文件 确保每次都读取最新的SWF文件 1：使用"Expires"标头 这是在HTML文件中告诉浏览器不读取本地缓存 在<he...
2020-02-22 18:01:29
527
原创 HTML代码的优化 应当仔细注意的细节
与Google和MSN相比，Yahoo!对HTML代码的关注程度更高。很多测试表明，HTML文件中的错误，可能在Google或MSN中影响很小甚至几乎没有，不妨碍该页面出现在SERP的前端;但在Yahoo!中获得成功的几率要小得多。同样的，一个修正了HTML错误，完全通过W3C认证的网站或网页，在Google或MSN的变化很小几乎很难察觉，但在Yahoo!中却能发现排名有质的飞跃。在网页设计及...
2020-02-22 18:00:47
548
原创 网页教程：为网站的Web Robot 设计路标
nternet越来越酷，WWW的知名度如日中天。在Internet上发布公司信息、进行电子商 务已经从时髦演化成时尚。作为一个Web Master，你可能对HTML、Javascript、Java、 ActiveX了如指掌，但你是否知道什么是Web Robot？你是否知道Web Robot和你所设 计的主页有什么关系？ Internet上的流浪汉--- Web Robot 有时你会莫名...
2020-02-22 17:59:45
863
原创 如何用HTML＋CSS编写灵活的Tab页
近在研究CSS，正好结合项目做了一个灵活的Tab页，使用纯HTML＋CSS实现，正好总结一下。首先看一下预览界面：下面开始讲述一下完成上述页面的步骤。1. 构建HTML构建HTML是整个过程最基础的部分。我们构建HTML比较关键的一个原则就是“还HTML标签其本来的含义”。所以在这里，我们应该合理分析一下期望做到的HTML的结构的情况，并加以分析，选择比较合适的HTML标...
2020-02-22 17:58:58
1766
原创 前端基础入门学习之HTML特殊字符显示（字符实体）
有些字符在HTML里有特别的含义，比如小于号<就表示HTML Tag的开始，这个小于号是不显示在我们最终看到的网页里的。那如果我们希望在网页中显示一个小于号，该怎么办呢？ 这就要说到HTML字符实体(HTML Character Entities)了。 一个字符实体(Character Entity)分成三部分：第一部分是一个&符号，英文叫ampersand；第二部分是实体(...
2020-02-21 20:04:05
1404
原创 语义化你的HTML标签和属性
语义化你的HTML标签和属性分离结构与表现的另一个重要方面是使用语义化的标记来构造文档内容。一个 XHTML 元素的存在就意味被标记内容的那部分有相应的结构化的意义，没有理由使用其他的标记。换句话说，不要让 CSS 使一个 HTML 元素看起来就像另一个 HTML 元素，比如用<div>来代替<p>标记标题。首先是关于语义（Semantics）和默认样式的区别，默认...
2020-02-21 20:02:06
2831
原创 IE里面打印HTML页面时的分页控制
在设计HTML页面的过程中经常会遇到表单元素覆盖样式元素引起的问题，图一就是一个典型的例子。不要小看这个貌似“低级”的问题，即使一些规模较大的网站上类似的问题也绝不鲜见。本文探讨了造成这一问题的根本原因，并提出一种补救办法——之所以说补救办法而不是一劳永逸的解决办法，是因为微软和NetScape这两个巨头也还没有对策。 一、HTML元素的显示优先级 HTML中常用的表单元素包括：文...
2020-02-21 20:00:56
1224
原创 HTML相比XHTML有什么特点
下面是W3C的HTML工作组主席Steven Pemberton回答的关于XHTML的常见基础问题。 问:什么是XHTML? 答: XHTML是一种为适应XML而重新改造的HTML。当XML越来越成为一种趋势，就出现了这样一个问题:如果我们有了XML，我们是否依然需要 HTML?为了回答这个问题，1998年5月我们在旧金山开了两天的工作会议，会议的结论是:需要。我们依然需要使用HTML...
2020-02-21 20:00:01
3013
原创 html前端开发教程符集的处理 多语言网站开发技术分析
多语言网站实现方案 1，静态:就是为每种语言分别准备一套页面文件，要么通过文件后缀名来区分不同语言，要么通过子目录来区分不同语言。 例如对于首页文件index_en.htm提供英语界面，index_gb.htm提供简体中文界面，index_big.htm提供繁体中文界面，或者是 en/index.htm提供英语界面，gb/index.htm提供简体中文界面，big/index.htm提...
2020-02-21 19:58:25
704
原创 Html网页页面head区规范知识
head区是指首页HTML代码的<head>和</head>之间的内容。 必须加入的标签 1.公司版权注释 <!--- The site is designed bywebjx.com 06/2006 ---> 2.网页显示字符集 简体中文：<META HTTP-EQUIV="Content-Type" CONTENT="tex...
2020-02-21 19:56:57
2842
原创 web前端基础教程之“画中画”效果-谈Iframe标记的使用
纵观时下网站，本来网速就有些慢，可是几乎每页都要放什么Banner，栏目图片，版权等一大堆雷同的东西，当然，出于网站风格统一、广告效应的需要，本无可厚非，可毕竟让用户的钱包为这些“点缀“的东西”日益消得钱憔悴”了，有没有办法，让这些雷同的东西一次下载后就不用再下载，而只下载那些内容有变化区域的网页内容呢？ 答案很肯定：应用Iframe标记！ 一、Iframe标记的使用 提起...
2020-02-21 19:55:41
1252
原创 web前端开发教程之编写简洁的页面表单验证程序
看了山人表单验证，又看了其他一些验证程序和相关的一些参考资料，写出了一个比较简洁的js表单验证程序。功能简述：验证：http地址 时间日期 e-mail 数字 字符长度检查 一项输入与另一项输入比较（例如：密码的确认输入） 大小比较（只能有一个比较符号）特点扩展容易，可以方便的添加自己需要的验证方式 兼容性好（ie5,6 firefox,oprea） 可用性好...
2020-02-21 19:54:36
941
原创 html基础教程之分析总结一下＜li＞和＜hr＞的样式定义
希望对大家有所帮助。 li {list-style-image: url(images/disc.gif);} li的这个样式定义是将列表项目使用图片来代替显示的小圆点。当然您也可以显示成其它效果，详细请参阅下面的定义: 列表项目效果的CSS定义 *list-style-type: circle(可换成自己想要的样式); 列表项目样式 disc : CSS1 ...
2020-02-21 19:53:14
2877
原创 2020年web前端开发学习路线和实战开发教程指南
随着互联网的深入发展，前端开发工程师已成为市场上极具竞争力的人才。许多学生，包括以前的UI，java，或完全零基础，想学习的前端。下面的地图是在互联网上广泛传播的前端学习地图。许多初学者说，当他们看到这些密集的知识点时会感到头晕目眩。事实上，前端是一个宽泛的主题。但你需要学习前端你不必惊慌，虽然内容比较多，但没有跟踪可循，只要一步一步地不怕学习不好的前端！那么前端开发到底需要学习些什么呢？我应...
2020-02-21 19:51:25
820
原创 web前端基础教程实践DIV＋CSS网页布局入门指南
你正在学习CSS布局吗？是不是还不能完全掌握纯CSS布局？通常有两种情况阻碍你的学习：第一种可能是你还没有理解CSS处理页面的原理。在你考虑你的页面整体表现效果前，你应当先考虑内容的语义和结构，然后再针对语义、结构添加CSS。这篇文章将告诉你应该怎样把HTML结构化。另一种原因是你对那些非常熟悉的表现层属性(例如：cellpadding,、hspace、align="left"等等)束手无...
2020-02-20 15:12:43
1081
原创 网页制作学习用好HTML字体标记及属性
我们在这里将要谈的是有关文字的标记，包括字体大小、颜色、字型...等变化，适当的应用可以增加页面的美观！ 常用字体标记<Hn>...</Hn> 标题 ，设定标题字体大小， n = 1 ( 大 ) ~ 6 ( 小 ) 会自动跳下一行。通常用在如章节、段落等标题上。 如 : <H2> 标题 </H2> 标题 如 : <...
2020-02-20 15:11:28
4083
原创 程序员学习前端基础教程网页设计用好HTML表格标记及属性
表格是HTML的一项非常重要功能，利用其多种属性能够设计出多样化的表格。使用表格可以使你的页面有很多意想不到的效果，使页面更加整齐美观。 常用表格标记<TABLE>...</TABLE> 表格指令 。相关属性 :· ALIGN 调整· BGCOLOR 背景颜色· BORDER 边框· HEIGHT 高度· WIDTH 宽度 <C...
2020-02-20 15:10:02
2964
原创 CSS网页制作时实现自动换行的小技巧
大家都知道连续的英文或数字能是容器被撑大，不能根据容器的大小自动换行，下面是 CSS如何将他们换行的方法！ 对于div 1.（IE浏览器）white-space:normal; word-break:break-all;这里前者是遵循标准。#wrap{white-space:normal; width:200px; }或者#wrap{word-break:break-all;w...
2020-02-20 15:08:45
2242
原创 web前端基础教程入门——关于CSS样式表
一.在学习css之前你应该掌握哪些基础知识1.什么是网页，什么是超文本语言（html）。2.会使用Dreamweaver等常用的网页编辑器。Dreamweaver是现今最好的网站编辑工具之一，而Dreamweaver8增加的对CSS的支持更是你容易得来使用CSS，用它来给制作网页的CSS样式表会更简单、更方便。本教程教你如何利用Dreamweaver8在页面中加入CSS，你不用死记硬背的记代...
2020-02-20 15:06:44
637
原创 web前端基础学习教程CSS样式表应用技巧两则
一、 去除超级链接的下划线以及在超级链接上实现鼠标悬停变色: 在默认情况下，用DreamWeaver设计的网页中的超级链接都有下划线，看上去不大美观。要去除这些讨厌的下划线,很多报刊介绍的方法都是在HTML源代码中手工加入一段代码，其实在DreamWeave中很容易去除链接的下划线。首先在DreamWeaver的Document Windows中随便建立一个链接，你可以看到这个链接会有下划线...
2020-02-20 15:05:35
622
原创 html中隐藏域hidden的作用介绍及使用示例
基本语法：<input type="hidden" name="field＿name" value="value">作用：1 隐藏域在页面中对于用户是不可见的，在表单中插入隐藏域的目的在于收集或发送信息，以利于被处理表单的程序所使用。浏览者单击发送按钮发送表单的时候，隐藏域的信息也被一起发送到服务器。2 有些时候我们要给用户一信息，让他在提交表单时提交上来以确定用户身份，...
2020-02-18 21:36:51
4618
原创 html+css基础教程入门学习之DIV常用属性大全自己整理
一、属性列表复制代码代码如下:color : #999999 文字颜色font-family : 宋体 文字字型font-size : 10pt 文字大小font-style:itelic 文字斜体育font-variant:small-caps 小字体letter-spacing : 1pt 文字间距line-height : 200% 设定行高f...
2020-02-18 21:02:07
769
原创 在HTML中引入CSS的3种方式使用介绍
在HTML中，引入CSS的方法主要有行内式、内嵌式、导入式和链接式行内式：即在标记的style属性中设定CSS样式，这种方式本质上没有体现出CSS的优势，因此不推荐使用例：复制代码代码如下:<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"...
2020-02-18 21:00:35
3587
原创 html内联元素和块级元素的基本概念及使用示例
html标签分为两种，内联元素和块级元素，首先我们先了解一下内联元素和块级元素的概念：块级元素：一般是其它元素的容器，可容纳内联元素和其它块级元素，块级元素排斥其它元素与其位于同一行，可设置宽度(width)高度(height)属性，正常流中的块级元素会垂直摆放。常见块状元素为“div”内联元素（行内元素）：内联元素只能容纳文本或者其他内联元素，是块级元素的后代，它允许其他内联元素与其位于...
2020-02-18 20:58:52
3699
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人