网站建设公司模板,站酷网素材图库,wordpress首页不显示页面,wordpress手机端显示pc端选择器
什么是选择器
选择器是指通过一定的语法规则选取到对应的HTML标记#xff0c;然后给这个对应的HTML标记设置样式。
选择器分为四大类#xff1a;基本选择器、复合选择器、 伪类选择器、属性选择器基本选择器通用选择器#xff1a;将匹配HTML所有标签。不建议使用。…选择器
什么是选择器
选择器是指通过一定的语法规则选取到对应的HTML标记然后给这个对应的HTML标记设置样式。
选择器分为四大类基本选择器、复合选择器、 伪类选择器、属性选择器基本选择器通用选择器将匹配HTML所有标签。不建议使用。比如*{margin:0px}标签选择器匹配对应的HTML标签。比如p{font-size:14px}类选择器给定指定的CLASS属性值的元素设置样式。比如.box{width:800px;}id选择器可以为标有特殊id的HTML元素指定特定的样式只能使用一次。id选择器以#来定义。比如#title{font-size:14px;}复合选择器选择器1,选择器2{属性:值;} 多元素选择器同时匹配选择器1和选择器2多个选择器之间用逗号分隔举例 p,h1,h2{margin:0px;}E F{属性:值;} 后代元素选择器匹配所有属于E元素后代的F元素E和F之间用空格分隔举例 #slidebar p {font-color: #990000}E F{属性:值;}子元素选择器匹配所有E元素的子元素F举例 div p{color:#990000;}E F{属性:值;}相邻元素选择器匹配所有紧随E元素之后的同级元素F举例 div div{color:#990000;}伪类选择器伪类选择器是用来给超级链接的不同状态来设置样式。:link 向未被访问的链接添加样式 :visitied 向已被访问的链接添加样式:hover 当鼠标悬浮在元素上方时向元素添加样式:active 鼠标放在元素上面时点击的一瞬间注意超级链接的不同状态它其实是有顺序。也就是说伪类选择器设置其实是有顺序。如果不按照伪类选择器的顺序那么样式就会失效。顺序要遵守“爱恨准则”要先有爱才有恨。“Love Hate” LVHA属性选择器什么是属性选择器属性选择器它是与标签的属性名和属性值有关。属性选择器是通过标签的属性名和属性值来匹配元素。选择器 含义 举例[attr] 匹配指定的属性名的所有元素 h1[align]{}[attrval] 匹配属性等于指定值的所有元素 h1[aligncenter]{}[attr*val] 匹配属性中包含指定值的所有元素 Font[color*00][attr$val] 匹配属性的值以指定值结束的所有元素 Font[color$00][attr^val] 匹配属性以指定值开头的所有元素 Font[color^00]基本选择器
通用选择器
通用选择器_行内式 对于body中所有的元素设置属性color#f00,通用选择器通用就是对所有的。 *{}在中括号中写样式代码*星号来匹配所有的。
!DOCTYPE html
html
headmeta charsetutf-8title/title
/head
bodyfont color#f00h2请回答出中国的四大名著/h2ulli西游记/lili红楼梦/lili水浒传/lili三国演义/li/ulp《红楼梦》中国古代章回体长篇小说中国古典四大名著之首。其通行本共120回一般认为前80回是清代作家曹雪芹所著后40回作者为无名氏由高鹗、程伟元整理。小说以贾、史、王、薛四大家族的兴衰为背景以大荒山青埂峰下顽石幻化的通灵宝玉为视角以贾宝玉与林黛玉、薛宝钗的爱情婚姻悲剧为主线描绘了一些闺阁佳人的人生百态展现了真正的人性美和悲剧美是一部从各个角度展现中国清代社会百态的史诗性著作。/p/font
/body
/html通用选择器_嵌入式
!DOCTYPE html
html
headmeta charsetutf-8title/titlestyle typetext/css/*使用嵌入式*//*使用通用选择器来设置样式*//*给HTML中的所有的标签设置样式*/*{color: #00f; /* 蓝色 */}/style
/head
bodyh2请回答出中国的四大名著/h2ulli西游记/lili红楼梦/lili水浒传/lili三国演义/li/ulh4看我是否能变蓝色/h4p《红楼梦》中国古代章回体长篇小说中国古典四大名著之首。其通行本共120回一般认为前80回是清代作家曹雪芹所著后40回作者为无名氏由高鹗、程伟元整理。小说以贾、史、王、薛四大家族的兴衰为背景以大荒山青埂峰下顽石幻化的通灵宝玉为视角以贾宝玉与林黛玉、薛宝钗的爱情婚姻悲剧为主线描绘了一些闺阁佳人的人生百态展现了真正的人性美和悲剧美是一部从各个角度展现中国清代社会百态的史诗性著作。/p
/body
/html标签选择器
就是根据不同的标签设置不同的样式。 这里的标签就是HTML中元素的标签比如要给p标签设置样式可以写p{},中括号中写样式代码。这样就能匹配HTML中所有的p标签从而设置样式。
!DOCTYPE html
html
headmeta charsetutf-8title标签选择器/titlestyle typetext/css/*使用嵌入式*//*使用标签选择器来设置样式*/h2{color: #f00;}p{color: #00f;}/style
/head
bodyh2请回答出中国的四大名著/h2ulli西游记/lili红楼梦/lili水浒传/lili三国演义/li/ulp《红楼梦》中国古代章回体长篇小说中国古典四大名著之首。其通行本共120回一般认为前80回是清代作家曹雪芹所著后40回作者为无名氏由高鹗、程伟元整理。小说以贾、史、王、薛四大家族的兴衰为背景以大荒山青埂峰下顽石幻化的通灵宝玉为视角以贾宝玉与林黛玉、薛宝钗的爱情婚姻悲剧为主线描绘了一些闺阁佳人的人生百态展现了真正的人性美和悲剧美是一部从各个角度展现中国清代社会百态的史诗性著作。/p
/body
/html类选择器
对应HTML中元素的class属性对不同的class设置不同的样式。 给类为class1的元素可以设置.class1{}也就是.类名在中括号中写样式代码class1必须在HTML中是存在的。 比如想要获取div标签下的类为class1的元素设置样式可以写div.class1也就是标签名.类名{}。
!DOCTYPE html
html
headmeta charsetutf-8title类选择器/titlestyle typetext/css/*使用嵌入式*//*使用类选择器来设置样式*/.h{color: #f00;}/*先找到p标签然后再去找p标签里面有没有class为profile有的话就设置这个样式*/p.profile{color: #00f;}/style
/head
bodyh2 classh请回答出中国的四大名著/h2ul classhli西游记/lili红楼梦/lili水浒传/lili三国演义/li/ulp classprofile《红楼梦》中国古代章回体长篇小说中国古典四大名著之首。其通行本共120回一般认为前80回是清代作家曹雪芹所著后40回作者为无名氏由高鹗、程伟元整理。小说以贾、史、王、薛四大家族的兴衰为背景以大荒山青埂峰下顽石幻化的通灵宝玉为视角以贾宝玉与林黛玉、薛宝钗的爱情婚姻悲剧为主线描绘了一些闺阁佳人的人生百态展现了真正的人性美和悲剧美是一部从各个角度展现中国清代社会百态的史诗性著作。/p
/body
/htmlid选择器
对应HTML中元素的id属性对不同的id设置不同的样式。 给id为id1的元素可以设置#id1{}也就是#id名{}在中括号中写样式代码id1必须在HTML中是存在的。
!DOCTYPE html
html
headmeta charsetutf-8titleid选择器/titlestyle typetext/css/*使用嵌入式*//*使用id选择器来设置样式*/#h{color: #f00;}/style
/head
bodyh2 idh请回答出中国的四大名著/h2ul idhli西游记/lili红楼梦/lili水浒传/lili三国演义/li/ulp《红楼梦》中国古代章回体长篇小说中国古典四大名著之首。其通行本共120回一般认为前80回是清代作家曹雪芹所著后40回作者为无名氏由高鹗、程伟元整理。小说以贾、史、王、薛四大家族的兴衰为背景以大荒山青埂峰下顽石幻化的通灵宝玉为视角以贾宝玉与林黛玉、薛宝钗的爱情婚姻悲剧为主线描绘了一些闺阁佳人的人生百态展现了真正的人性美和悲剧美是一部从各个角度展现中国清代社会百态的史诗性著作。/p
/body
/html