css样式表有哪些（CSS样式表存在形式有哪些,应用的侧重点分别是什么）

本文目录

• CSS样式表存在形式有哪些,应用的侧重点分别是什么
• CSS样式表多少种
• Web前端面试指导（五十）：CSS样式书写有哪些
• css层叠样式表有哪几种类型

CSS样式表存在形式有哪些,应用的侧重点分别是什么

一共有三种 形式存在第一种为标签样式，taglib为标签名，后面{}里面加属性,这种样式对页面内所有的标签名为taglibname的标签起作用。第二种为css类样式，需要在HTML开始标签 后缀 class=“name“，name即类名，这类标签对HTML内所有后缀同样name的标签起作用 class=“name“ 可以设在多个开始标签后，表示这些标签具有同一类样式。第三种为cssID样式，需要在HTML开始标签后缀 id=“id“,需要注意的是，ID样式的话，每一个name都是独立且不重复的，具有唯一性。希望我的回答对你有帮助

CSS样式表多少种

内联样式：

是直接写到元素上，非常不推荐，因为违反了结构，表现分离的原则：

内部样式：

是写在html的head中，这样的样式适合单独的页面，比如一些专题页面，css就自己用，然后你也不想引用多个文件：

外部样式：

应该是做好的一种方式，就是通过link来把样式表引入，修改的话直接在样式表中修改：

@import：

最后一种输入的方式，应该是用@import url(/css/a.css)来引入吧，这种方式在样式表中还可以引入其他样式表，不过我从来没用过。

Web前端面试指导（五十）：CSS样式书写有哪些

一、CSS书写顺序1.位置属性(position, top, right,z-index, display, float等)2.大小(width, height, padding,margin)3.文字系列(font, line-height,letter-spacing, color- text-align等)4.背景(background, border等)5.其他(animation, transition等)二、CSS书写规范1.使用CSS缩写属性CSS有些属性是可以缩写的，比如padding,margin,font等等，这样精简代码同时又能提高用户的阅读体验。2.去掉小数点前的“0”3.简写命名很多用户都喜欢简写类名，但前提是要让人看懂你的命名才能简写哦！4.16进制颜色代码缩写有些颜色代码是可以缩写的，我们就尽量缩写吧，提高用户体验为主。5连字符CSS选择器命名规范1）长名称或词组可以使用中横线来为选择器命名。2）不建议使用“_”下划线来命名CSS选择器，为什么呢？输入的时候少按一个shift键；浏览器兼容问题（比如使用_tips的选择器命名，在IE6是无效的）能良好区分JavaScript变量命名（JS变量命名是用“_”）6.不要随意使用idid在JS是唯一的，不能多次使用，而使用class类选择器却可以重复使用，另外id的优先级优先与class，所以id应该按需使用，而不能滥用。7.为选择器添加状态前缀有时候可以给选择器添加一个表示状态的前缀，让语义更明了，比如下图是添加了“.is-”前缀。三、CSS命名规范常用的CSS命名规则头：header内容：content/Container尾：footer导航：nav侧栏：sidebar栏目：column页面外围控制整体布局宽度：wrapper左右中：left right center登录条：loginbar标志：logo广告：banner页面主体：main热点：hot新闻：news下载：download子导航：subnav菜单：menu子菜单：submenu搜索：search友情链接：friendlink页脚：footer版权：copyright滚动：scroll内容：content标签：tags文章列表：list提示信息：msg小技巧：tips栏目标题：title加入：joinus指南：guide服务：service注册：regsiter状态：status投票：vote合作伙伴：partnerID的命名-页面结构容器: container页头：header内容：content/container页面主体：main页尾：footer导航：nav侧栏：sidebar栏目：column页面外围控制整体布局宽度：wrapper左右中：left right centerID的命名-导航导航：nav主导航：mainnav子导航：subnav顶导航：topnav边导航：sidebar左导航：leftsidebar右导航：rightsidebar菜单：menu子菜单：submenu标题: title摘要: summaryID的命名-功能标志：logo广告：banner登陆：login登录条：loginbar注册：register搜索：search功能区：shop标题：title加入：joinus状态：status按钮：btn滚动：scroll标签页：tab文章列表：list提示信息：msg当前的: current小技巧：tips图标: icon注释：note指南：guild服务：service热点：hot新闻：news下载：download投票：vote合作伙伴：partner友情链接：link版权：copyright四、注释规范/* Header */内容区/* End Header */五、注意事项1.一律小写;2.尽量用英文;3.尽量不缩写，除非一看就明白的单词。六、CSS样式表文件命名主要的 master.css模块 module.css基本共用 base.css布局、版面 layout.css主题 themes.css专栏 columns.css文字 font.css表单 forms.css补丁 mend.css打印 print.css

css层叠样式表有哪几种类型

CSS（Cascading Style Sheets）层叠样式表优势：CSS可以提高页面的浏览速度。缩短改版时间，降低维护费用。强大的字体控制能力和排版能力。css容易编写。可以一次设计随处发布。更好的控制页面布局。实现表现和结构、内容相分离。更方便搜索引擎的搜索/page Rank样式规则：语法：选择器｛属性1：值1；属性2：值2；...属性N：值N；｝选择器就是要改变页面中的哪些标签元素声明要用｛｝括起来，；结束如果属性中包含空格要用“”括起来可以指定多个选择器使用相同的样式样式表：外部样式表，新建.css文件，在文件中写入样式规则《link rel=“stylesheet“ href = “xxx.css“》内联样式表，在元素中添加style属性嵌入式样式表，在html使用《style》标签，《style type=“text/css“》《/style》选择器：元素选择器，元素名id选择器，用#id类选择器，用.class后代选择器，选择器1 选择器2css深化：就近原则，！important提高元素优先级，伪类选择器，伪对象选择器，@import导入其他css文件，响应式布局可以解决多设备的兼容问题。文本属性：font-family：字体font-size：字体大小font-style：斜体font-weight：粗体color：颜色line-height：行高letter-spacing：字符间距text-decoration：文本修饰text-overflow：文字溢出处理white-space : no wraptext-overflow:hiddentext-align：文本对齐背景属性：background-color：背景颜色background-image：背景图片background-repeat：背景重复background-attachment：背景图片附着基于占满一整行与否，标签分为两大类（文档流）：占满：行级元素（div，p，h1~h6）不占满：行内元素（span，）定位属性：position：定位absolute：绝对定位relative：相对定位