CSS基础与高级技巧-优快云博客

本文链接：https://blog.youkuaiyun.com/iteye_7666/article/details/82358125

一个CSS语句必不可少的两部分：选择器和属性
CSS的单位是所有CSS属性的基础。常用的单位主要有颜色单位和长度单位
简单选择器：html-tag-name(代码中找到的任何标记比如<a>、</a>、<div>、<ul>){},#id=tag-name{},.class-tag-name{}，可嵌套使用(用空格分开)outer-html-tag-name inner-html-tag-name { … }，或作为一个列表将一种设计元素应用到多个选择器1st-html-tag-name, 2nd-html-tag-name { … }

优先级别：类选择器的优先级>标签选择器>ID选择器，同级别的选择器后定义的优先级较高。在选择器中使用!important优先级最高。eg:P{color:#333 !important;}
ID选择器和类选择器的区别：ID选择器不能复用。在一个xhtml文档中，一个ID选择器只能把其CSS样式指定给一个标签
组合选择器：标签选择器+ ID选择器或标签选择器+ 类选择器两种

[att=val] //属性=val

[att*=val]//属性包括val

[att^=val]//属性以val开头

[att$=val]//属性结尾字符为val

选择器：伪元素{属性：值}

也可以与类配合使用，用法如下：

选择器类名：伪元素{属性：值}

css中主要有四个伪元素选择器：

eg: :root{background-color:yellow;} //整个网页的背景色为黄色, 若没指定则以body样式为主

body{background-color:yellow;}//body元素的背景色设为绿色

eg: boyd *:not(h1){background-color:yellow;}//排除h1元素

eg: :empty{background-color:yellow;}//空白元素背景色为黄色

eg: :target{background-color:yellow;}//用户点击页面的超链接并且跳转到id=text1后背景色为黄色

<div id="text1">可以使用target样式</div>

================================================================================

text-decoration:textline //textline文字修饰线，可使用：none(默认是无，但a标签默认有下划线)、underline(添加下划线) overline(顶划线) line-through(删除线) blink(文字闪烁，只能在FF浏览器中正常显示)

<dl>

<dd>概念的解释</dd>

</dl>

list-style-image的属性设置为none或指定的图片不可用，则list-style-type属性起作用。即若list-style-image生效，则list-style-type就不生效。

=========div+css布局===========================================================

补白：用于增加页面元素边框与内容之间的空间，语法：padding:length //length可以是单位长度，百分比，关键字auto，其缩写形式与边距是一样的
边框：页面元素可视范围的最外圈，包括页面元素的补白和内容。
所有的XHTML页面元素只有两种：一是块级元素，即垂直排列（换行，高度、行高及上下边距都可控制），二是行内元素，即水平排列（同行，高度、行高及上下边距都不可控制）
CSS有三种基本的布局方式：常规流、浮动和定位