CSS 子选择器(六)_html/css_WEB-ITnose-html tutorial-php.cn

CSS 子选择器(六)_html/css_WEB-ITnose

WBOY

Lepaskan： 2016-06-24 11:46:20

asal

1303 orang telah melayarinya

一、子选择器

子选择器中前后部分之间用一个大于号隔开，前后两部分选择符在结构上属于父子关系。

子选择器是根据左侧选择符指定的父元素，然后在该父元素下寻找匹配右侧选择符的子元素。

二、简单例子

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>子选择器</title><link type="text/css" rel="stylesheet" href="css/demo5.css"/></head><body><div>  <p>这是个段落   <a href="#">这是超连接</a>   </p></div></body></html>

Salin selepas log masuk

@charset "utf-8";/* CSS Document *//*设置div下的p元素的样式*/div>p{    font-size:14px;    color:#0000FF;    }/*设置p元素下的a元素的样式*/p>a{    font-size:16px;    color:#FF0000;    text-decoration:none;}/*错误的写法 div 与a不是父子关系时，是取不到的*/div>a{    font-size:20px;    color:#FF0000;    text-decoration:none;}

Salin selepas log masuk

子选择器很少用到，一般使用包含选择可以不受父子关系影响的选择

以下写法包含选择器

div a{    font-size:20px;    color:#FFFF00;    text-decoration:none;}

Salin selepas log masuk

Php8, saya datang juga

Ketahui reka letak tapak web dalam masa 30 minit

Tutorial Video Permulaan Shangguan Oracle kepada Mahir

Baris pertama kod UNI-APP anda

Berkibar dari awal ke pelancaran apl

Tutorial Video Linux Baharu Brother Lian

Tutorial Video AXURE 9 (Sesuai untuk UI Reka Bentuk Produk Interaktif Pengurus Produk)

Tutorial Video PS Kemahiran Asas Sifar

Tutorial video UI 16 hari untuk anda bermula

Tutorial Video Teknik PS dan Teknik Menghiris

Tutorial Video Pembinaan Persekitaran Awan Alibaba dan Pelancaran Projek

Gambaran Keseluruhan Rangkaian Komputer - Pengetahuan Asas yang Perlu Dikuasai Pengaturcara

Tutorial Penting untuk Pengaturcara - Penjelasan Protokol HTTP

Tutorial Video Websocket

CSS 子选择器(六)_html/css_WEB-ITnose

一、子选择器

二、简单例子