前言：
当前咱们对“css中常见的选择器”大致比较重视，朋友们都想要剖析一些“css中常见的选择器”的相关知识。那么小编同时在网摘上汇集了一些对于“css中常见的选择器””的相关内容，希望兄弟们能喜欢，我们快快来学习一下吧！选择器与样式的设置暂时全部写在<style></style>标签中;/**/表示注释
CSS常用属性设置
1)CSS的计量单位
在CSS中表示宽度,距离时最常用的计量单位：1)px(像素)2)30%(百分比)3)em相对单位)
2)常用选择器
2.1标签(元素)选择器;例如body,input,ul,img,a等等
设置文本框样式;还有可以设置其很多样式不再细说
2.2类选择器:为指定元素添加一个class属性,此属性值为样式的名称,如果一个元素有多个class,其名称之间加空格;在style标签中类名前面加点"."
设置li样式
2.3id选择器:为指定元素添加一个id属性,此属性值为样式的名称,在style标签中此名称前面加点"#"一般用于Javascript中选择指定元素进行操作
消除li前面的样式
有关li前面样式的类型
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <link href="1.css" rel="stylesheet" /> <title>层叠样式表</title> <style type="text/css"> /*1 标签选择器*/ input { /*边框宽度,类型(实线,虚线等),颜色*/ border: 1px solid red; /*文本框的宽高*/ width: 200px; height: 50px; /*文本框背景颜色*/ background-color: burlywood; /*文本框内容的颜色*/ color: rgb(44, 11, 226); /*文字大小*/ font-size: 20px; /*文字类型*/ font-family:Arial; /*文字居中显示*/ text-align:center; } li{ /*先统一为li设置一个样式,下面的类选择器中为具体li单独设置样式*/ border: 1px solid red; width: 150px;height: 30px; padding:10px; /*li之间的距离*/ margin: 10px; /*文字到li边框的距离*/ } /*2 类选择器*/ .c1{ /*名称暂时随便起的,每个公司都有自己具体的命名规范*/ border: 1px solid black; font-size: 25px; /*文字大小*/ color: chartreuse; /*文字颜色*/ } .c2{ border: 1px solid green; font-size: 20px; text-align: center; /*文字按照li设置的宽度居中显示*/ color:chocolate; } #id1{ /*将li前面的符号消除*/ list-style:none; } </style></head><body> <ul> <li class="c1">公司首页</li> <li class="c2">公司简介</li> <li id="id1">产品展示</li> <li>人才招聘</li> <li>联系我们</li> </ul> 用户名:<input type="text" value=""></input></body></html>CSS其他的选择器以后遇到再说,样式的有关属性及其值太多不再一一细说,以后遇到时通过例题再说
版权声明：
本站文章均来自互联网搜集，如有侵犯您的权益，请联系我们删除，谢谢。
标签： #css中常见的选择器 #html文本框文字颜色
