你可能不知道的CSS的一些属性

来源:互联网 发布:工业大数据行业分析 编辑:程序博客网 时间:2024/05/16 13:01

1:unicode-bidi 属性与 direction 属性一起使用,来设置或返回文本是否被重写,以便在同一文档中支持多种语言。

用法:unicode-bidi: normal|embed|bidi-override|intitial|inherit;

值描述normal默认。不使用附加的嵌入层面。embed创建一个附加的嵌入层面。bidi-override创建一个附加的嵌入层面。重新排序取决于 direction 属性。inheritunicodeBidi 属性的值从父元素继承。

<!DOCTYPE html><html><head><meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title><style>div.ex1{direction:rtl;unicode-bidi:bidi-override;}</style></head><body><div class="ex1">123456</div></body></html>


2:给表格td加边框的时候,会出现表格双边框的情况


解决方式

给table

table{border-collapse:collapse;}

3:所有CSS伪类/元素

选择器示例示例说明:checkedinput:checked选择所有选中的表单元素:disabledinput:disabled选择所有禁用的表单元素:emptyp:empty选择所有没有子元素的p元素:enabledinput:enabled选择所有启用的表单元素:first-of-typep:first-of-type选择每个父元素是p元素的第一个p子元素:in-rangeinput:in-range选择元素指定范围内的值:invalidinput:invalid选择所有无效的元素:last-childp:last-child选择所有p元素的最后一个子元素:last-of-typep:last-of-type选择每个p元素是其母元素的最后一个p元素:not(selector):not(p)选择所有p以外的元素:nth-child(n)p:nth-child(2)选择所有p元素的第二个子元素:nth-last-child(n)p:nth-last-child(2)选择所有p元素倒数的第二个子元素:nth-last-of-type(n)p:nth-last-of-type(2)选择所有p元素倒数的第二个为p的子元素:nth-of-type(n)p:nth-of-type(2)选择所有p元素第二个为p的子元素:only-of-typep:only-of-type选择所有仅有一个子元素为p的元素:only-childp:only-child选择所有仅有一个子元素的p元素:optionalinput:optional选择没有"required"的元素属性:out-of-rangeinput:out-of-range选择指定范围以外的值的元素属性:read-onlyinput:read-only选择只读属性的元素属性:read-writeinput:read-write选择没有只读属性的元素属性:requiredinput:required选择有"required"属性指定的元素属性:rootroot选择文档的根元素:target#news:target选择当前活动#news元素(点击URL包含锚的名字):validinput:valid选择所有有效值的属性:linka:link选择所有未访问链接:visiteda:visited选择所有访问过的链接:activea:active选择正在活动链接:hovera:hover把鼠标放在链接上的状态:focusinput:focus选择元素输入后具有焦点:first-letterp:first-letter选择每个<p> 元素的第一个字母:first-linep:first-line选择每个<p> 元素的第一行:first-childp:first-child选择器匹配属于任意元素的第一个子元素的 <]p> 元素:beforep:before在每个<p>元素之前插入内容:afterp:after在每个<p>元素之后插入内容:lang(language)p:lang(it)为<p>元素的lang属性选择一个开始值


CSS Media Queries for 
iPads & iPhones

0 0
原创粉丝点击