【css引用与html语义化】的更多相关文章

css引用与html语义化

一.CSS引用1. 使用外部样式表:    CSS代码在一个独立的文件中,HTML通过link元素引入到页面 格式:link + tab键<link rel="stylesheet" herf"../目标"> 特点:- 实现了内容结构和表现形式的代码分离,方便复用和维护 - 使HTML代码更加纯洁,有利于程序员和搜索擎的阅读 2.使用内部样式表:   将CSS代码写到HTML文档的style元素内容中 格式:<stely>样式</ste…

CSS代码命名惯例语义化的方法

CSS代码的命名惯例一直是大家热门讨论的话题.今天暴风彬彬想通过分析一个流行三栏布局中的必要元素,来为大家讲解关于使用语义化方法替代结构化方法来命名CSS类的建议和指导. 您还可以参考彬Go的相关文章:<整理及优化CSS代码的7个原则><10个CSS简写技巧让你永远受用><DIV+CSS网页布局常用的一些基础知识整理> CSS类命名的语义化VS结构化方式 一般而言,CSS类名的语义化声明方式应当考虑你的页面中某个相对元素的”用意”,独立于它的”定位”或确切的特性(结构化…

标签语义化之常用HTML标签

一.布局的理解误区 网络上流行管新型的布局方式叫“DIV+CSS”,其实是一个错误的理解,导致了很多人过度依赖与滥用DIV标签, HTML提供了我们一共七八十个标签,其中常用的有三十个左右,DIV不过是一个相对的空标签而已,在很多情况下,我们可以使用其他更合适且更简洁的标签可以替代它. 二.标签的差异 共性:都是一个容器,可以在其中放置内容 差异:分为行内和块级两个大类,且不同便签有相应含义上的预设,如:h-标题,p-段落,a-链接,等等 三.标签语义化的好处 a.让结构更简洁,让搜索引擎更友好…

一天搞定HTML----标签语义化04

根据页面里不同的内容,选择最适合它的标签,而不通篇只用一种标签 标签语义化作用: 代码演示 通过比较- - -H5布局和DIV+CSS 布局- - -体现标签语义化 注意: 标签语义化,不仅仅只是指使用特定含义的标签.因此不能完全否定DIV+CSS布局是没有语义化的,以前用的都是DIV+CSS布局,它是存在标签语义化的. 这里只是为了说明语义化,使用两者比较. <!DOCTYPE html> <html> <head> <meta charset="UT…

语义化标签和media媒体查询可以放心使用

现在的高级浏览器都支持html5,只有IE6-IE8不支持.(下面说的IE均值IE6-IE8) 有两个特性在IE是可以使用的: 1.语义化标签: header(头部) section(区块) footer(底部) nav(导航) dialog(弹出层) aricle(内容) aside(侧边栏) figure(放置图像.图表) 2.media媒体查询: 支持min-width和max-width,可以让IE也支持响应式布局. 让IE支持这两种特性的方法: 引入插件:html5shiv.js和re…

.使用 HTML+CSS 实现如图布局，border-widht 5px，一个格子大小是 50*50，hover时候边框变为红色（兼容IE6+，考虑语义化的结构）

<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>css淘宝测试练习题</title> <style type="text/css"> *{margin: 0;padding: 0;font-size:…

你应该了解的CSS语义化命名方式及常用命名规则

CSS语义化命名 从上图我们可以大概看出这里有两种CSS的命名方式:1.结构化命名法:2.语义化命名法. 结构化命名法:根据页面中板块的位置而命名,如上图中的content-left,这时如果我们想把侧边栏sidebar放在左边,那么这时content-left板块却在右边,板块位置与其命名完全不符,那么我们这时就要修改页面中的以及CSS样式中的选择器名字了,这样会很不方便,尤其是当页面结构复杂时,一会儿left,一会儿right,这样会很不容易维护. 语义化命名法:根据页面中模块的功能而命名,…

CSS语义化命名

CSS语义化命名 从上图我们可以大概看出这里有两种CSS的命名方式:1.结构化命名法:2.语义化命名法. 结构化命名法:根据页面中板块的位置而命名,如上图中的content-left,这时如果我们想把侧边栏sidebar放在左边,那么这时content-left板块却在右边,板块位置与其命名完全不符,那么我们这时就要修改页面中的以及CSS样式中的选择器名字了,这样会很不方便,尤其是当页面结构复杂时,一会儿left,一会儿right,这样会很不容易维护. 语义化命名法:根据页面中模块的功能而命名,…

智能选择器和语义化的CSS

本文由白牙根据Heydon Pickering的<Semantic CSS With Intelligent Selectors>所译,整个译文带有我自己的理解与思想,如果译得不好或不对之处还请同行朋友指点.如需转载此译文,需注明英文出处:http://coding.smashingmagazine.com/2013/08/20/semantic-css-with-intelligent-selectors/,以及作者相关信息 ——作者:Heydon Pickering ——译者:白牙 “结构…

谈CSS布局中HTML标签语义化

很多人都在做前端,当然这里包括很多新手,也许在新手的想法就是在做布局的时候不要用font标签之类的就算是web标准了,这样一来,造成如今网上“div泛滥”,一看源文件,霍,除了div没其他标签了. 这里,我可以很负责的告诉大家,这不叫web标准,这叫“div+css”.名副其实的“div+css”.也许有人会说,我用“div+css”做出来的页面完全表达出设计图的意图,浏览器都兼容,没有任何问题.的确,你这样做出来的页面看起来是没任何问题,注意,这里说的是“看起来没任何问题”,仅此而已. 人是可…