在HTML和CSS里存在着部分重复的功能,例如两者都可以设定一段文字的字体属性。既然如此,为啥还要CSS呢(至少,为啥CSS里存在着和HTML标签属性重复的东西呢)?

这是因为,HTML和CSS的用途是不同的:

  • HTML用于标记文档结构
  • CSS用于展现形式

上面的文字可能比较简单抽象;下面的blog有个例子:

https://www.jjxiaoliu.cn/?p=66

我们应该尽量避免使用HTML里遗存的那些和展现形式有关的标签,将它们都挪到CSS里去。

HTML与CSS:结构与表现的更多相关文章

  1. HTML+CSS结构与表现原则

    CSS网页布局即版式布局,是网页设计师将有限的视觉元素进行有机的排列组合.主要通过CSS的浮动.定位功能来实现UI设计的布局要求. 常见的布局有:一列布局,两列布局,三列布局和混合布局. HTML清除 ...

  2. 一、HTML和CSS基础--网页布局--网页简单布局之结构与表现原则

    结构.表现和行为分离,不仅是一项技术,更主要的是一种思想,当我们拿到一个网页时,先考虑设计图中的文字内容和内容模块之间的关系,重点放在编写html结构和语义化,然后考虑布局和表现形式.,减少HTML与 ...

  3. 初学者用div+css结构写网页的几个误区

    1.用div+css结构制作静态html网页不等于彻底抛弃古老的table写法.之所以不建议用table来布局网页是因为在网页加载很慢的时候要等table结构加载完成才能看到网页,其次是table的布 ...

  4. 网页简单布局之结构与表现原则(HTML/CSS)

    结构 样式 行为真正的分离 前端初级人员会在页面上单纯的用各个div把相关内容独立开: 前端中级人员明白相关属性的设置会给元素带来什么改变,从而减少div的书写: 前端高级人员会以及其简单的和稳定的方 ...

  5. css的元素表现

    块级元素和行内元素的表现: 块级元素:块级元素和父元素的宽度一致,默认情况下就是和body的宽度一样,也可以说和浏览器窗口的宽度一致,致使同一行不能再放下另外的元素,所以块级元素表现为独占一行. 块级 ...

  6. CSS结构和层叠

    每个合法的文档都会生成一个文档树,从而能根据元素的祖先,属性,兄弟元素等创建选择器来选择元素.有了这个结构树,选择器才能起作用,这也是CSS继承的核心.继承是从一个元素向其后代元素传递属性值所采用的机 ...

  7. Web前端新人笔记之CSS结构和层叠

    上一篇文章介绍了如何利用CSS选择器为元素应用各种丰富的样式,每个合法的文档都会生成一个结构树,了解这一点,就能根据元素的祖先.属性.兄弟等元素穿件选择器选择元素. 本篇文章将讨论3中机制之间的关系: ...

  8. CSS结构伪类E:first-child/last-child/only-child/empty

    E:first-child解释:E的父元素的第一个子元素正好是E,给这个E定义样式 E:last-child解释:E的父元素的最后一个子元素正好是E,给这个E定义样式 E:only-child解释:E ...

  9. css结构选择器组合使用,选择父元素中多个子元素中某一段元素

    nth-of-type()和nth-child()写法一样,这里只用nth-of-type()演示,习惯type 直接上代码 /* 从前向后选择,第6个开始 */ li:nth-of-type(n+6 ...

随机推荐

  1. linux之关于学习必备知识

    文件列表的定义: 第一个字符表示文件类型  d为目录  -为普通  1为链接  b为可存储的设备接口  c为键盘鼠标等输入设备 2~4个字符表示所有者权限,5~7个字符表示所有者同组用户权限,8~10 ...

  2. 剑指Offer (汇总)

    刷完剑指Offer很久了,前几天想起来去年开通的博客园,正好把刷题笔记整理一下 刷题平台:牛客网 刷题语言:Python **链表(8道)** [剑指Offer 3. 从尾到头打印链表 (链表)](h ...

  3. SQL server 的身份验证模式

    windows身份验证(本机的ip地址或者localhost 或者.或者127.0.0.1) SQL Server身份验证(用户名和密码登录) 常见的错误代码18456(登录失败)和18470(账户被 ...

  4. ckeditor_配置 修改工具栏段落的标签和在文中的格式

    在默认的工具栏中自带一个格式的选项,可以编辑文字的段落属性,将文字转换为标题.ckeditor中提供了方法可以对这个标签进行修改. 正在做的项目中不叫标题1标题2,叫章.节.条... . 需要进行配置 ...

  5. linux学习笔记2 - linux常用命令

    转载请标注原链接:http://www.cnblogs.com/xczyd/p/5543731.html 第一篇博客:linux学习笔记1-ubuntu的安装与基本设置 之中,已经介绍了如何安装lin ...

  6. php中print、echo、print_r、var_dump的区别

    echo,print,print_r,var_dump区别 print只能接收一个字符串:print有返回值1(可在表达式中使用) e.g print 'string 1' e.g if($exp & ...

  7. HDU - 6127: Hard challenge(扫描线,atan)

    pro:给定N个二维平面的关键点,保证两点连线不经过原点.现在让你安排一条经过原点,但是不经过关键点的直线,使得两边的和的乘积最大. sol:由于连线不经过原点,所以我们极角排序即可. 具体:因为我们 ...

  8. 评测parser的好坏

    1.在dependency parsing中一般是用 LAS UAS 来衡量 简要说来UAS是知道是边对了(也就是它依赖的节点找对了)就算对,而LAS在前者的基础上要求更加严格,还要求边的Label也 ...

  9. python 读fnl数据

    (1) FNL 数据介绍 FNL((Final Operational Global Analysis)数据是美国国家环境预报中心(NECP)/美国国家大气研究中心(NCAR)提供的全球再分析资料,空 ...

  10. javaWeb-Servlet工作原理

    1.客户发出请求—>Web 服务器转发到Web容器Tomcat: 2.Tomcat主线程对转发来用户的请求做出响应创建两个对象:HttpServletRequest和HttpServletRes ...