-
在表单元素中，单选按钮和复选按钮都具有选中和未选中状态。（大家都知道，要覆写这两个按钮默认样式比较困难）。在CSS3中，我们可以通过状态选择器“:checked”配合其他标签实现自定义样式。而“:checked”表示的是选中状态。查看全部
-
“:disabled”选择器刚好与“:enabled”选择器相反，用来选择不可用表单元素。要正常使用“:disabled”选择器，需要在表单元素的HTML中设置“disabled”属性。查看全部
-
“:only-child”选择器选择的是父元素中只有一个子元素，而且只有唯一的一个子元素。也就是说，匹配的元素的父元素中仅有一个子元素，而且是一个唯一的子元素。查看全部
-
“:first-child”选择器表示的是选择父元素的第一个子元素的元素E。简单点理解就是选择元素中的第一个子元素，记住是子元素，而不是后代元素。查看全部
-
CSS3 结构性伪类选择器—target :target选择器称为目标选择器，用来匹配文档(页面)的url的某个标志符的目标元素。 点击链接显示隐藏的段落。 HTML代码： <h2><a href="#brand">Brand</a></h2> <div class="menuSection" id="brand"> content for Brand </div> CSS代码： .menuSection{ display: none; } :target{/*这里的:target就是指id="brand"的div对象*/ display:block; } 分析： 1、具体来说，触发元素的URL中的标志符通常会包含一个#号，后面带有一个标志符名称，上面代码中是：#brand 2、：target就是用来匹配id为“brand”的元素（id="brand"的元素）,上面代码中是那个div元素。 多个url（多个target）处理： 就像上面的例子，#brand与后面的id="brand"是对应的，当同一个页面上有很多的url的时候你可以取不同的名字，只要#号后对的名称与id=""中的名称对应就可以了。 如下面例子： html代码： <h2><a href="#brand">Brand</a></h2> <div class="menuSection" id="brand"> content for Brand </div> <h2><a href="#jake">Brand</a></h2> <div class="menuSection" id="jake"> content for jake </div> <h2><a href="#aron">Brand</a></h2> <div class="menuSection" id="aron"> content for aron </div> css代码： #brand:target { background: orange; color: #fff; } #jake:target { background: blue; color: #fff; } #aron:target { background: red; color: #fff; }查看全部
-
:empty选择器表示的就是空。用来选择没有任何内容的元素，这里没有内容指的是一点内容都没有，哪怕是一个空格。查看全部
-
input:not([type="submit"]){ border:1px solid red; }查看全部
-
column-rule-style 类似于border-style属性，主要用来定义列边框样式，其默认值为“none”。column-rule-style属性值与border-style属值相同，包括none、hidden、dotted、dashed、solid、double、groove、ridge、inset、outset。查看全部
-
CSS3——为边框应用图片： border-image:url() 70 70 70 70 repeat; 70 70 70 70 指切割图片的宽度 repeat指图片延伸方式——有三种：round（平铺）repeat（重复）stretch（拉伸） CSS3颜色——颜色之RGBA： color：rgba（R,G,B,A） A为透明的参数，不可为负值查看全部
-
CSS3——圆角效果： border-radius:5px 4px 3px 4px; 左上角，右上角，右下角，左下角。 CSS3——块阴影与文字阴影： box-shadow:x轴的偏移量 y轴的偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式]（可设置inset时为内部阴影方式，如果省略为外阴影方式） x轴的偏移量：必填（允许负值） y轴的偏移量：必填（允许负值） 阴影模糊半径：模糊距离 阴影扩展半径：阴影尺寸 阴影模糊半径与阴影扩展半径的区别： 阴影模糊半径：此参数可选，其值只能是正值，如果为零时，表示阴影不具有模糊效果，其值越大阴影的边缘就越迷糊。 阴影扩展半径：此参数可选，其值可以为负值，如果值为正，则整个阴影部分延展扩大，反之值为负值时，则缩小。查看全部
-
/*用相邻选择器结合伪元素制作导航列表项分隔线，减少代码量*/ li+li::before { content: ""; position: absolute; top: 16px; left: 0; width: 1px; height: 20px; background: rgba(0, 0, 0, 0.3); }查看全部
-
CSS3选择器 ::selection选择器 用来匹配突出显示的文本(用鼠标选择文本时的文本样式)。 HTML代码： <p>“::selection”伪元素是用来匹配突出显示的文本。浏览器默认情况下，选择网站文本是深蓝的背景，白色的字体，</p> CSS代码： ::-moz-selection { background: red; color: green; } ::selection { background: red; color: green; }查看全部
-
CSS3选择器 :checked选择器 在表单元素中，单选按钮和复选按钮都具有选中和未选中状态。“:checked”表示的是选中状态。 input[type="checkbox"] + span { opacity: 0; } input[type="checkbox"]:checked + span { opacity: 1; }查看全部
-
CSS3选择器 :disabled选择器 “:disabled”选择器刚好与“:enabled”选择器相反，用来选择不可用表单元素。 input[type="text"]:disabled { background: rgba(0,0,0,.15); border: 1px solid rgba(0,0,0,.15); color: rgba(0,0,0,.15); }查看全部
-
CSS3选择器 :enabled选择器 表单元素有可用（“:enabled”）和不可用（“:disabled”）状态。在默认情况之下，表单元素都处在可用状态。我们可以通过伪选择器“:enabled”对这些表单元素设置样式。 input[type="text"]:enabled { background: #ccc; border: 2px solid red; box-shadow:0 0 5px #f36; }查看全部
举报
0/150
提交
取消