15年来,为全国50万+企业提供互联网数字化基础应用服务。
知 识
0514-86177077
9:00-17:00(工作日)
首 页
企业400电话
Hot
网站☯建设
微网小程序
商标✡知产
网络营销推广
AI电话机器人
热
彩铃©短信
增值拓展业务
新
主页
>
知识库
> HTML 结构化实现方法
HTML 结构化实现方法
热门标签:
400电话座机怎么办理
邵阳市地图标注app
电销机器人外呼失败怎么回事
天津销售电销机器人公司
齐齐哈尔地图标注地点
南宁销售外呼系统线路商
400电话申请好不好
吃鸡地图标注设置
县域地图标注点
DIV+css的结构
你正在学习CSS布局吗?是不是还不能完全掌握纯CSS布局?通常有两种情况阻碍你的学习:
第一种可能是你还没有理解CSS处理页面的原理。在你考虑你的页面整体表现效果前,你应当先考虑内容的语义和结构,然后再针对语义、结构添加CSS。这篇文章将告诉你应该怎样把HTML结构化。
另一种原因是你对那些非常熟悉的表现层属性(例如:cellpadding,、hspace、align="left"等等)束手无策,不知道该转换成对应的什么CSS语句。 当你解决了第一种问题,知道了如何结构化你的HTML,我再给出一个列表,详细列出原来的表现属性用什么CSS来代替。
结构化HTML
我们在刚学习网页制作时,总是先考虑怎么设计,考虑那些图片、字体、颜色、以及布局方案。然后我们用Photoshop或者Fireworks画出来、切割成小图。最后再通过编辑HTML将所有设计还原表现在页面上。
如果你希望你的HTML页面用CSS布局(是CSS-friendly的),你需要回头重来,先不考虑“外观”,要先思考你的页面内容的语义和结构。
外观并不是最重要的。一个结构良好的HTML页面可以以任何外观表现出来,CSS Zen Garden是一个典型的例子。CSS Zen Garden帮助我们最终认识到CSS的强大力量。
HTML不仅仅只在电脑屏幕上阅读。你用photoshop精心设计的画面可能不能显示在PDA、移动电话和屏幕阅读机上。但是一个结构良好的HTML页面可以通过CSS的不同定义,显示在任何地方,任何网络设备上。
开始思考
首先要学习什么是"结构",一些作家也称之为"语义"。这个术语的意思是你需要分析你的内容块,以及每块内容服务的目的,然后再根据这些内容目的建立起相应的HTML结构。
如果你坐下来仔细分析和规划你的页面结构,你可能得到类似这样的几块:
标志和站点名称
主页面内容
站点导航(主菜单)
子菜单
搜索框
功能区(例如购物车、收银台)
页脚(版权和有关法律声明)
我们通常采用DIV元素来将这些结构定义出来,类似这样:
<div id="header"></div>
<div id="content"></div>
<div id="globalnav"></div>
<div id="subnav"></div>
<div id="search"></div>
<div id="shop"></div>
<div id="footer"></div>
这不是布局,是结构。这是一个对内容块的语义说明。当你理解了你的结构,就可以加对应的ID在DIV上。DIV容器中可以包含任何内容块,也可以嵌套另一个DIV。内容块可以包含任意的HTML元素---标题、段落、图片、表格、列表等等。
根据上面讲述的,你已经知道如何结构化HTML,现在你可以进行布局和样式定义了。每一个内容块都可以放在页面上任何地方,再指定这个块的颜色、字体、边框、背景以及对齐属性等等。
使用选择器是件美妙的事
id的名称是控制某一内容块的手段,通过给这个内容块套上DIV并加上唯一的id,你就可以用CSS选择器来精确定义每一个页面元素的外观表现,包括标题、列表、图片、链接或者段落等等。例如你为#header写一个CSS规则,就可以完全不同于#content里的图片规则。
另外一个例子是:你可以通过不同规则来定义不同内容块里的链接样式。类似这样:#globalnav a:link或者 #subnava:link或者#content a:link。你也可以定义不同内容块中相同元素的样式不一样。例如,通过#content p和#footerp分别定义#content和#footer中p的样式。从结构上讲,你的页面是由图片、链接、列表、段落等组成的,这些元素本身并不会对显示在什么网络设备中(PDA还是手机或者网络电视)有影响,它们可以被定义为任何的表现外观。
一个仔细结构化的HTML页面非常简单,每一个元素都被用于结构目的。当你想缩进一个段落,不需要使用blockquote标签,只要使用p标签,并对p加一个CSS的margin规则就可以实现缩进目的。p是结构化标签,margin是表现属性,前者属于HTML,后者属于CSS。(这就是结构于表现的相分离.)
良好结构的HTML页面内几乎没有表现属性的标签。代码非常干净简洁。例如,原先的代码<tablewidth="80%" cellpadding="3" border="2"align="left">,现在可以只在HTML中写<table>,所有控制表现的东西都写到CSS中去,在结构化的HTML中,table就是表格,而不是其他什么(比如被用来布局和定位)。
亲自实践一下结构化
上面说的只是最基本的结构,实际应用中,你可以根据需要来调整内容块。常常会出现DIV嵌套的情况,你会看到"container"层中又有其它层,结构类似这样:
<div id="navcontainer">
<div id="globalnav">
<ul>a list</ul>
</div>
<div id="subnav">
<ul>another list</ul>
</div>
</div>
嵌套的div元素允许你定义更多的CSS规则来控制表现,例如:你可以给#navcontainer一个规则让列表居右,再给#globalnav一个规则让列表居左,而给#subnav的list另一个完全不同的表现。
用CSS替换传统方法
下面的列表将帮助你用CSS替换传统方法:
HTML属性以及相对应的CSS方法
HTML属性
CSS方法说明
align="left"
align="right" float: left;
float: right; 使用CSS可以浮动任何元素:图片、段落、div、标题、表格、列表等等
当你使用float属性,必须给这个浮动元素定义一个宽度。
marginwidth="0"leftmargin="0" marginheight="0" topmargin="0" margin: 0; 使用CSS,margin可以设置在任何元素上, 不仅仅是body元素,更重要的,你可以分别指定元素的top, right,bottom和left的margin值。
vlink="#333399" alink="#000000" link="#3333FF" a:link #3ff;
a:visited: #339;
a:hover: #999;
a:active: #00f;
在HTML中,链接的颜色作为body的一个属性值定义。整个页面的链接风格都一样。使用CSS的选择器,页面不同部分的链接样式可以不一样。
bgcolor="#FFFFFF" background-color: #fff; 在CSS中,任何元素都可以定义背景颜色,不仅仅局限于body和table元素。
bordercolor="#FFFFFF" border-color: #fff; 任何元素都可以设置边框(boeder),你可以分别定义top, right, bottom和left
border="3"cellspacing="3" border-width: 3px; 用CSS,你可以定义table的边框为统一样式,也可以分别定义top, right, bottom and left边框的颜色、尺寸和样式。
你可以使用 table, td or th 这些选择器.
如果你需要设置无边框效果,可以使用CSS定义: border-collapse: collapse;
<br clear="left">
<br clear="right">
<br clear="all">
clear: left;
clear: right;
clear: both;
许多2列或者3列布局都使用float属性来定位。如果你在浮动层中定义了背景颜色或者背景图片,你可以使用clear属性.
cellpadding="3"
vspace="3"
hspace="3" padding: 3px; 用CSS,任何元素都可以设定padding属性,同样,padding可以分别设置top, right, bottom and left。padding是透明的。
align="center" text-align: center;
margin-right: auto; margin-left: auto;
Text-align 只适用于文本.
象div,p这样的块级可以通过margin-right: auto; 和margin-left: auto;来水平居中
一些令人遗憾的技巧和工作环境
由于浏览器对CSS支持的不完善,我们有时候不得不采取一些技巧(hacks)或建立一种环境(Workarounds)来让CSS实现传统方法同样的效果。例如块级元素有时候需要使用水平居中的技巧,盒模型bug的技巧等等。所有这些技巧都在MollyHolzschlag的文章《Integrated Web Design: Strategies for Long-Term CSS HackManagement》中有详细说明。
另外一个关于CSS技巧的资源站点是Big John和Holly Bergevin的“Position is Everything”。
理解浮动行为
Eric Meyer的《Containing Floats》将帮助你掌握如何使用float属性布局。float元素有时候需要清除(clear),阅读《How To Clear Floats Without Structural Markup》将非常有帮助。
标签:
赣州
宁夏
宁波
延安
济宁
日照
海口
衡水
巨人网络通讯声明:本文标题《HTML 结构化实现方法》,本文关键词 HTML,结构化,实现,方法,HTML,;如发现本文内容存在版权问题,烦请提供相关信息告之我们,我们将及时沟通与处理。本站内容系统采集于网络,涉及言论、版权与本站无关。
相关文章
下面列出与本文章《HTML 结构化实现方法》相关的同类信息!
HTML 结构化实现方法
DIV+css的结构 你正在学习CSS布局吗?是不是还不能完全掌握纯CSS布局?通常有两种情况阻碍你的学习: 第一种可能是你还没有理解CSS处理页面的原理。在你考虑你的页面整体表现效果前...
10-16
代理400电话的企业对象(400电话代理公司)
众所周知,400电话热线以自身超群的优势成为许多集团企业的通讯新宠,是继800之后的又一杰出通讯工具,完美解决了传统固...
11-07
深智云智能插座方案,助力企业低成本快速布局智能家居
近年来,随着物联网技术与相关应用的广泛兴起,智能家居这一与消费者联系最紧密的智能化应用场景成为当下物联网市场最...
10-16
广州电销卡归属地(广州电销卡办理)
本文目录一览:1、营业厅可以办理白名单电销卡吗?2、电销卡高频不封是真的吗?在哪购买?3、大连电销卡归属地4、电销卡是...
07-10
潍坊防封电销卡代理
潍坊防封电销卡代理 潍坊防封电销卡代理,潍坊电销卡代理,潍坊防封电销卡,潍坊电销卡 电销企业想要开展公司业务,那就需...
06-24
四川400电话怎么办理费用(400电话办理资费)
【四川400电话怎么办理费用】 400电话 是联通、电信和移动三大运营商专门为企业设计的企业电话总机。目前,正规注册的企...
11-07
包含惠州回拨外呼系统厂家的词条
本文目录一览: 1、外呼系统哪家公司做得好? 2、外呼系统公司哪家好用? 3、电销外呼系统品牌排名,哪家好 4、外呼系统靠...
11-25
寻找电销团队合作方案模板(寻找电销团队合作方案模板图片)
本篇文章给咱们谈谈寻觅电销团队协作计划模板,以及寻觅电销团队协作计划模板图片对应的常识点,期望对各位有所帮助,...
05-18
WindowsXP笔记本断网后一直都连接不上要等很长时间
很多WindowsXP系统用户朋友都知道拨号连接上网,拨号连接也是比较多问题的,最近就收到一个用户反映说拨号连接断网后一直...
10-20
房地产电话机器人转型(房地产 机器人)
今天给各位分享房地产电话机器人转型的知识,其中也会对房地产 机器人进行解释,如果能碰巧解决你现在面临的问题,别...
11-06
关于贵阳智能电销系统公司的信息
今日给各位共享贵阳智能电销体系公司的常识,其间也会对进行解说,假如能可巧处理你现在面对的问题,别忘了重视本站,...
05-18
智能营销软件探索AI制度供给责无旁贷。
智能营销软件探索AI制度供给责无旁贷。深圳市数心科技有限公司历经多年的技术积累和研发实践,融合互联网、云计算及人...
10-24
内部商标许可政策的六大技巧
随着高等教育机构越来越多地将外部商标许可外包给第三方服务商,大学和大学在与学生团体和部门内部许可其商标时应保持...
10-23
理财电销使用介绍
外呼模板【理财电销使用介绍】 试听后,我们可以正式开始外呼任务。 在外呼任务的执行过程中,我们可以实时看到整个外...
10-30
建立知识产权管理体系
种子企业知识产权管理是对企业所拥有的知识产权进行开发、运用和保护的综合管理。有效的知识产权管理不仅能对种子企业...
10-23
大庆外呼saas系统(大连外呼系统)
今天给各位分享大庆外呼saas系统的知识,其中也会对大连外呼系统进行解释,如果能碰巧解决你现在面临的问题,别忘了关...
11-06
等保测评:Centos超时退出问题
目录 一、说明 二、设置TMOUT方式 2.1. 实现方式 2.2. 具体查询方式 2.3. 配置查询的注意点 三、修改sshd_config文件方式 3.1. Clie...
10-16
西安电销机器人功能(机器人电销智能系统)
今日给各位共享西安电销机器人功用的常识,其间也会对机器人电销智能体系进行解说,如果能可巧处理你现在面对的问题,...
05-18
win8系统中的宽带连接在哪以及如何创建宽带连接
随着微软新一代Win8系统逐渐成为主流,不少新购买的电脑用户普遍用上了Win8,不过近期很多小白朋友在Win8中找不到宽带连接...
10-20
客户管理系统平台,营销与销售管理一体化
客户管理系统平台是一款专为企业设计的营销与销售管理一体化平台,软件支持对企业客户进行分类管理、多维度的统计分析...
07-12
各种AJAX方法的使用比较详解
阅读目录 开始 第一代技术:生成客户端代理脚本调用服务端 新技术的改进方向 第二代技术:jQuery直接调用WebService 第三代技...
10-18
申请400电信号码(申请400电信号码怎么申请)
申请400电信号码(申请400电信号码怎么申请) 随着时代的发展和科技的进步,越来越多的企业选择使用400电信号码,以提升...
08-14
400咨询电话是多少400电话的客服电话
400咨询电话是多少400电话的客服电话以下内容由巨人小编整理发布。 华为400客服电话。 400电话分为4006中国联通、4007中国移...
05-16
春节假期圆满结束,这些公司都迫不及待的使用上电话机器人了
春节假期刚结束,你是否也一样接到了,热情的销售人员的电话祝福,这让我们很诧异,难道他们都不会有春节延缓症么?怎...
01-13
Go Gin实现文件上传下载的示例代码
Go Gin 实现文件的上传下载流读取 文件上传 router router.POST("/resources/common/upload", service.UploadResource) service type: POST data:{ “save...
10-18
无锡电销外呼系统怎么样(电销外呼系统公司)
本文目录一览: 1、外呼体系怎么样?2、电销体系好用吗?3、外呼体系跟电销卡比起来,有哪些优势和下风?4、电销体系好...
11-28
稳定高频电销卡渠道-电销卡办理
数维通信主营电销卡、不封号电话卡、不封卡电话卡、防封外呼系统、电销专用卡、电销软件、高频防封电销座机,国代渠道...
01-16
XTools:CRM之殇,学着像微信一样思考
CRM系统之难,难以上青天。这是在国内绝大多数企业没能把CRM用起来的主要原因。纵观国内CRM市场,可谓冷冷清清,凄凄惨惨...
10-19
鞍山电销卡外呼系统怎么样(外呼系统和电销卡)
本文目录一览: 1、外呼琐细跟电销卡比起来,有哪些优势和优势? 2、外呼琐细怎样样? 3、电销卡和外呼琐细哪个好? 外...
11-25
电话机器人必须要不断的升级,完善才可以继续生存下去
电话机器人必须要不断的升级,完善才可以继续生存下去。电话机器人采用最前沿的深度学习技术,先进的语音识别、口语理...
10-31
Win10专业版无法打开内置应用该如何解决
越来越多的计算机硬件产品开始慢慢的不兼容以往的系统了,大多数人都选择Win10专业版当作电脑系统,但使用过程中也会遇...
10-19
度言智能电话机器人使用(电话机器人说话)
本文目录一览:1、想请问一下智能语音机器人一天可以打多少电话?2、电话机器人怎么用?3、电话智能客服机器人4、智能电话...
08-28
为什么400的号码打不通上海400电话怎么办理
400电话是一个由10个数字组成的虚拟号码,可以绑定多个手机或固定电话,不会有占线。 所以遇到400电话打不通的情况,先不...
01-12
宁波极信电销卡办理(宁波极信电销卡办理地点)
本文目录一览:1、不留痕电话卡怎么办理2、电销卡需要用身份证办理吗?3、电销卡可以在手机上注销吗4、电销卡在哪里办理...
07-10
外呼平台是做什么的,外呼系统公司(外呼系统公司有哪些)
外呼平台是做什么的,外呼系统公司 百度百科已经给了明确的解释; 外呼营销系统是根据市场客户的需求,综合了各行业不...
10-13
微创与华为共造高效呼叫中心
全球领先的信息与通信解决方案供应商华为,近日携手合作伙伴在上海世博中心隆重召开了云计算大会,期间展示了华为呼叫...
10-22
语音电销机器人介绍词(智能语音电销机器人怎么操作)
今天给各位分享语音电销机器人介绍词的知识,其中也会对智能语音电销机器人怎么操作进行解释,如果能碰巧解决你现在面...
05-16
400开头的号码要收费吗400开头电话怎么收费
400开头的号码要收费吗400开头电话怎么收费以下内容由巨人小编整理发布。 400电话并不是全免费的,是主、被叫分摊付费的...
05-16
宜兴服务外包超额完成上半年任务
上周,江苏卓易信息科技股份有限公司、江苏晟宜环保有限公司等宜兴市9家企业,共获得总额290万元的2014年度江苏省服务外...
10-22
包含外呼中心软件的词条
本篇文章给大家谈谈外呼中心软件,以及对应的知识点,希望对各位有所帮助,不要忘了收藏本站喔。 本文目录一览:1、移...
08-27
杭州稳定电话外呼线路需要多少钱,电销系统办理商家-注意!
一企嗨电话营销系统 1.当前的电销场景有哪些困扰? 1)手机.卡频繁被封,电销业务难以启动; 2)销售人员号码被标注,...
12-17
电销语音机器人说明(智能语音电销机器人怎么操作)
今天给各位分享电销语音机器人说明的知识,其中也会对智能语音电销机器人怎么操作进行解释,如果能碰巧解决你现在面临...
03-28
海口移动手机靓号赏析18417288888,五连号“发发发发发”
当今社会,对手机靓号的追求显然已经成为了一种时尚,因为一个好的手机号就是身份和社会地位的象征,尤其是“征战”商...
11-07
transcosmos:我对客服的解读
我是一个生于90年代的帅小伙, 加入transcosmos做客服工作有一年多的时间了。 伴随经验的不断丰富, 对客户服务工作也有了...
10-19
国家知识产权局检查组来绵阳检查知识产权保护工作
来源:方志四川 近日,国家知识产权局保护司司长张志成一行来绵检查考核知识产权保护工作。 检查组一行通过实地检查、...
10-23
卡升级白金卡电销(升级白金卡会直接收年费吗)
本文目录一览:1、中信信用卡被电话销售骗升级白金卡自动扣了2000元免费可以同过法律途...2、我的中信银行信用卡普卡,客...
07-10
外呼系统精准获客(外呼呼叫系统)
本文目次一览: 1、经营商年夜数据精准获客,真正靠得住的平台是哪个? 2、此刻有哪些外呼零碎对照靠谱? 3、什么叫智能...
11-25
陕西财税专用语音电销机器人办理服务商-请看!
陕西财税专用语音电销机器人办理服务商从一定程度上解决了人为因素造成的影响,提高了企业高层对企业的管理力度;此外...
05-17
奔腾设计师:海尔设计领导家电世界
当世界顶级德国工业设计师遇上世界第一家电品牌海尔,会碰撞出什么样的火花?德国时间 9 月 1 日, 2017 年国际消费电子展...
10-16
Html注释 Html中标记文字注释的符号
HTML注释,我们经常要在一些代码旁做一些HTML注释,这样做的好处很多,比如:方便查找,方便比对,方便项目组里的其它程序员了解...
10-16
陕西销售外呼系统(外呼销售是什么意思)
本文目录一览: 1、外呼体系怎样处理?2、西安睿婕集团自销猫外呼体系怎样样?3、外呼体系是什么意思4、西安外呼电话体...
04-22
HTML 结构化实现方法
DIV+css的结构 你正在学习CSS布局吗?是不是还不能完全掌握纯CSS布局?通常有两种情况阻碍你的学习: 第一种可能是你还没有理解CSS处理页面的原理。在你考虑你的页面整体表现效果前...
10-16
本页收集关于HTML 结构化实现方法的相关信息资讯供网民参考!
推荐文章
合肥高频外呼防封系统
外呼销售管理系统
广东外呼系统代理价格
百度地图标注营销
地图标注位置收费好还是免费好
万禾殡仪馆地图标注
南阳高频外呼系统好用吗
高德地图标注客服电话
临汾语音外呼系统报价
离线电子地图标注软件
xinfeng电话机器人
电销外呼系统视频
山西营销智能外呼系统哪个好
江西电销语音机器人
百度地图标注出现乱码
湖北ai语音电销机器人怎么样
四川地图旅游景点地图标注
昆明400电话申请
怎样在地图标注自己的公司名称
哪家电话机器人比较好
湖南智能电销机器人系统
航海路线地图标注时间
400电话如何申请单
江西云电销机器人厂家
电销机器人知识大全
衢州防封电销卡
杭州电销机器人官网
百度地图标注下载模板
电话机器人信息
宁夏房产智能外呼系统销售价格
衡水外呼系统接口对接
电销机器人 封号
武汉人工电销机器人软件
浙江防封外呼系统报价
湖北防封外呼系统平台
地图标注工作难不难
澳门语音电话机器人
温州智能外呼系统哪家好
昆明石柱电话机器人
赣州稳定外呼系统公司
滨州外呼系统平台
淮南外呼业务系统
智能电销机器人项目
临汾语音外呼系统
外呼系统软电话签不进去怎么办
南宁便宜电销机器人
400电话办理技术
智能外呼系统变量设置
宿迁智能外呼系统
外呼系统好赚钱
哈尔滨外呼系统中心
陕西高频外呼系统好用吗
衡水400电话哪里办理
池州外呼paas系统
五纵国道主干线地图标注
东莞长安地图标注
徐州市地图标注app
甘肃外呼系统哪里好
南昌营销电销机器人
魔兽世界地图标注
高德地图标注商铺费用
聊城中小企业外呼系统模式
辽宁电话营销外呼系统
桐庐地图标注
昆明云外呼系统线路
贷款外呼系统真的有用吗
打电话机器人问你好你是哪位
外呼系统现状
濮阳百应电销机器人加盟
西安电销机器人公司地址
新时达系统外呼楼层
石家庄市400电话申请
能打电话机器人
海外地图标注怎么操作
ios百度地图标注偏移
石嘴山电销推销机器人
高德地图标注是辅道不会有错吧
默纳克系统外呼插上不通电
合肥电销外呼系统运营商
厦门crm外呼系统招商
教育培训用什么外呼系统
智能语音电销机器人自用
襄阳房产电销机器人软件
电销防封卡app
新余公司外呼系统
ai电销机器人是真的吗
小型外呼管理系统费用
金昌电信400电话办理费用
怎么帮别人做地图标注一定成功
电销智能百应机器人
企业电话外呼营销系统
贵阳营销电销机器人报价
智能锁电话机器人的营销话术
电销机器人功能介绍
外呼系统怎么听录音
ai智能电话电销机器人报价
外呼获客软件系统是什么
十堰办理400电话
北京地图标注怎么样注册
世界历史地图标注
宁波外呼调研系统
北京自动外呼系统公司
江西智能外呼系统怎么样
百度地图标注商户名称后面数学
中山汽车导航地图标注
电话机器人哪里有
百度地图标注认领书审核不过
厦门企业电销机器人
如何办理400连锁电话
黄山腾讯地图标注
联合国地图标注
地图标注去过的地方和走过的路
电销机器人源码java
做外呼系统违法吗
400电话办理机构
贵州400电话如何办理
合肥市区地图标注
怎样在街景地图标注公司
谷歌疾控中心地图标注
连云港电销外呼系统哪个好
HTML 结构化实现方法
上一篇:
让IE8启动IE7兼容模式的代码
下一篇:
网页制作掌握的最常用的HTML标记
一起分享吧
产品关键词: HTML 结构化实现方法 HTML,结构化,实现,方法,HTML,