{"id":2033,"date":"2023-12-01T12:40:47","date_gmt":"2023-12-01T11:40:47","guid":{"rendered":"https:\/\/ittester.sk\/sin-categorizar\/css-selectores\/"},"modified":"2024-06-25T16:02:04","modified_gmt":"2024-06-25T14:02:04","slug":"css-selectores","status":"publish","type":"post","link":"https:\/\/ittester.sk\/es\/sin-categorizar\/tutorial-de-selenio\/css-selectores\/","title":{"rendered":"Selectores CSS"},"content":{"rendered":"\n<p>En esta parte del tutorial, aprenderemos sobre los selectores CSS y crearemos selectores CSS manualmente utilizando varios atributos de elementos web HTML. Utilizamos la herramienta firebug o la herramienta del desarrollador para obtener la informaci\u00f3n HTML de los elementos web. Para m\u00e1s detalles sobre la descarga y el uso de la herramienta firebug\/developer, consulta el tutorial &#8211; <a href=\"https:\/\/ittester.sk\/es\/sin-categorizar\/tutorial-de-selenio\/localizadores-en-selenium-webdriver\/\">Localizadores en Selenium WebDriver.<\/a><\/p>\n\n<h2 class=\"wp-block-heading\">\u00cdndice<\/h2>\n<div class=\"wp-block-aioseo-table-of-contents\"><ul><li><a class=\"aioseo-toc-item\" href=\"#aioseo-css-a-selektory-css-uvod\">CSS a selektory CSS \u2013 \u00favod<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-selektory-css\">Selektory CSS<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzivanie-id\">Pou\u017e\u00edvanie ID<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzivanie-triedy-class\">Pou\u017e\u00edvanie triedy &#8211; class<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzitie-znacky-tag\">Pou\u017eitie zna\u010dky &#8211; tag<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzivanie-atributov-a-ich-hodnoty\">Pou\u017e\u00edvanie atrib\u00fatov a ich hodnoty<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzivanie-znaciek-a-id-tags-and-id\">Pou\u017e\u00edvanie zna\u010diek a\u00a0id (tags and id)<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzitie-znaciek-a-triedy-tags-and-class\">Pou\u017eitie zna\u010diek a\u00a0triedy (tags and class)<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzivanie-znaciek-a-atributov-tags-and-attributes\">Pou\u017e\u00edvanie zna\u010diek a\u00a0atrib\u00fatov (tags and attributes)<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-vyhladavanie-podriadenych-prvkov-len-priame-podriadene-prvky-child\">Vyh\u013ead\u00e1vanie podriaden\u00fdch prvkov (len priame podriaden\u00e9 prvky &#8211; child)<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-umiestnenie-prvkov-vo-vnutri-inych-prvkov-child-subchild\">Umiestnenie prvkov vo vn\u00fatri in\u00fdch prvkov (child\/subchild)<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-n-te-dieta\">n-t\u00e9 die\u0165a<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-vyhladavanie-surodencov\">Vyh\u013ead\u00e1vanie s\u00farodencov<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-zacina-sa-na\">^ &#8211; Za\u010d\u00edna sa na<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-konci-sa-na\">$ &#8211; Kon\u010d\u00ed sa na<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-obsahuje\">* &#8211; Obsahuje<\/a><\/li><\/ul><\/div>\n<h2 class=\"wp-block-heading\" id=\"aioseo-css-a-selektory-css-uvod\">CSS y selectores CSS &#8211; introducci\u00f3n<\/h2>\n\n<p>CSS son las siglas en ingl\u00e9s de Hojas de Estilo en Cascada, que se utilizan para dar estilo a diversos elementos de una p\u00e1gina web HTML. En los archivos .css, podemos buscar elementos espec\u00edficos de una p\u00e1gina web (archivos .html) y luego darles estilo, por ejemplo, estableciendo el tama\u00f1o de la fuente, la anchura, la altura, etc.<\/p>\n\n<p>Utilizamos ciertas reglas proporcionadas como selectores CSS para encontrar los elementos web que hay que estilizar.<\/p>\n\n<p>Por ejemplo, el siguiente comando busca primero un elemento web que coincida con el patr\u00f3n del selector &#8211; \u00abdiv#searchBox\u00bb y, a continuaci\u00f3n, alinea el texto que contiene al centro.<\/p>\n\n<p><strong>div#searchBox { alineaci\u00f3n del texto: centro;}<\/strong><\/p>\n\n<p>En Selenium, podemos utilizar estas reglas\/patrones de selecci\u00f3n CSS para buscar elementos web y realizar posteriormente diversas operaciones sobre ellos. Por ejemplo:<\/p>\n\n<p><strong>\/\/Localizaci\u00f3n del elemento searchBox mediante el selector CSS<\/strong><\/p>\n\n<p><strong>WebElement searchBox = driver.findElement(By.cssSelector(\u00abdiv#searchBox\u00bb));<\/strong><\/p>\n\n<p><strong>\/\/Efectuar una operaci\u00f3n de clic sobre el elemento<\/strong><\/p>\n\n<p><strong>searchBox.sendKeys(\u00abITtester\u00bb);<\/strong><\/p>\n\n<p>Veamos ahora las diferentes reglas del selector CSS junto con su sintaxis y ejemplos de uso.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-selektory-css\">Selectores CSS<\/h2>\n\n<p>A continuaci\u00f3n se muestra la sintaxis y ejemplos de c\u00f3mo buscar los elementos necesarios y utilizarlos en los scripts selenium.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzivanie-id\">Uso del DNI<\/h2>\n\n<p><strong>Regla del selector CSS &#8211; #id<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00bbsubmitButton1&#8243; type=\u00bbbutton\u00bb class=\u00bbbtn\u00bb Enviar \/button&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; #submitButton1<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; &#8216;#submitButton1&#8217; selecciona el elemento con id &#8216;submitButton1&#8217;.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzivanie-triedy-class\">Utilizar la clase &#8211; clase<\/h2>\n\n<p><strong>Regla del selector CSS &#8211; .class<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00bbsubmitButton1&#8243; type=\u00bbbutton\u00bb class=\u00bbbtn\u00bb Enviar \/button&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; .btn<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; &#8216;.btn&#8217; selecciona todos los elementos con clase &#8216;btn&#8217;.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzitie-znacky-tag\">Uso de una etiqueta &#8211; tag<\/h2>\n\n<p><strong>Regla del selector CSS &#8211; tagName<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;input id=\u00bbfname\u00bb type=\u00bbtext\u00bb name=\u00bbfirstName\u00bb class=\u00bbtextbox\u00bb&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; entrada<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; &#8216;entrada&#8217; selecciona todos los elementos de tipo entrada.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzivanie-atributov-a-ich-hodnoty\">Utilizar atributos y sus valores<\/h2>\n\n<p><strong>Regla del selector CSS &#8211;  [attributeName=&#8217;attributeValue&#8217;]<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;input id=\u00bbfname\u00bb type=\u00bbtext\u00bb name=\u00bbfirstName\u00bb class=\u00bbtextbox\u00bb&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211;  [name=&#8217;firstName&#8217;]<\/li>\n\n\n\n<li>[name=&#8217;firstName&#8217;] Descripci\u00f3n &#8211; selecciona los elementos cuyo atributo name tenga el valor &#8216;firstName&#8217;.<\/li>\n<\/ul>\n\n<p>Utilizando estas reglas b\u00e1sicas de localizaci\u00f3n de elementos web, ahora podemos utilizarlas conjuntamente para crear localizadores m\u00e1s robustos que seleccionen elementos \u00fanicos.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzivanie-znaciek-a-id-tags-and-id\">Utilizar etiquetas e identificadores<\/h2>\n\n<p><strong>Regla del selector CSS &#8211; tag#id<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;input id=\u00bbfname\u00bb type=\u00bbtext\u00bb name=\u00bbfirstName\u00bb class=\u00bbtextbox\u00bb&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; input#fname<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; input#fname selecciona el elemento &#8216;input&#8217; con id &#8216;fname&#8217;.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzitie-znaciek-a-triedy-tags-and-class\">Utilizar etiquetas y clases<\/h2>\n\n<p><strong>Regla del selector CSS &#8211; tag.class<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;input id=\u00bbfname\u00bb type=\u00bbtext\u00bb name=\u00bbfirstName\u00bb class=\u00bbtextbox\u00bb&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; input.textbox<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; input.textbox selecciona el elemento &#8216;input&#8217; con id &#8216;textbox&#8217;.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzivanie-znaciek-a-atributov-tags-and-attributes\">Utilizar etiquetas y atributos<\/h2>\n\n<p><strong>Regla del selector CSS &#8211; etiqueta[attributeName=&#8217;attributeValue&#8217;]<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;input id=\u00bbfname\u00bb type=\u00bbtext\u00bb name=\u00bbfirstName\u00bb class=\u00bbtextbox\u00bb&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; entrada[name= firstname=\u00bb\u00bb]<\/li>\n\n\n\n<li>[name= firstname=\u00bb\u00bb] Descripci\u00f3n &#8211; input selecciona el elemento \u00abinput\u00bb con atributo \u00abname\u00bb con valor \u00abfirstName\u00bb.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-vyhladavanie-podriadenych-prvkov-len-priame-podriadene-prvky-child\">Buscar elementos hijos (s\u00f3lo elementos hijos directos &#8211; child)<\/h2>\n\n<p><strong>&gt;Regla del selector CSS &#8211; parentLocator childLocator<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;div id=\u00bbbuttonDiv\u00bb class=\u00bbsmall\u00bb&gt;<\/strong><\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00bbsubmitButton1&#8243; type=\u00bbbutton\u00bb class=\u00bbbtn\u00bb Enviar \/button&gt;<\/strong><\/p>\n\n<p><strong>&lt;\/div&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; div#buttonDiv&gt;button<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; &#8216;div#buttonDiv&gt;button&#8217; va primero al elemento div con id &#8216;buttonDiv&#8217; y luego selecciona su elemento hijo &#8211; &#8216;button&#8217;.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-umiestnenie-prvkov-vo-vnutri-inych-prvkov-child-subchild\">Colocaci\u00f3n de elementos dentro de otros elementos (hijo\/subhijo)<\/h2>\n\n<p><strong>Regla del selector CSS &#8211; localizador1 localizador2<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;div id=\u00bbbuttonDiv\u00bb class=\u00bbsmall\u00bb&gt;<\/strong><\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00bbsubmitButton1&#8243; type=\u00bbbutton\u00bb class=\u00bbbtn\u00bb Enviar \/button&gt;<\/strong><\/p>\n\n<p><strong>&lt;\/div&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; bot\u00f3n div#buttonDiv<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; &#8216;div#buttonDiv button&#8217; primero navega hasta el elemento div con id &#8216;buttonDiv&#8217; y luego selecciona el elemento &#8216;button&#8217; dentro de \u00e9l (que puede ser su hijo o hija).<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-n-te-dieta\">en\u00e9simo hijo<\/h2>\n\n<p><strong>Regla del selector CSS &#8211; :nth-child(n)<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;ul id=\u00bbTiposDePrueba\u00bb&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li Pruebas de automatizaci\u00f3n \/li&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li Pruebas de rendimiento \/li&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li Pruebas manuales \/li&gt;<\/strong><\/p>\n\n<p><strong>&lt;\/ul&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; #testingTypes li:nth-child(2)<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; &#8216;#testingTypes li:nth-child(2)&#8217; selecciona el elemento con id &#8216;testingType&#8217; y luego encuentra 2. de un descendiente de tipo li, t. j. Elemento de la lista \u00abPruebas de rendimiento\u00bb.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-vyhladavanie-surodencov\">Buscar hermanos<\/h2>\n\n<p><strong>Regla del selector CSS &#8211; localizador1+localizador2<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;ul id=\u00bbTiposDePrueba\u00bb&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li id=\u00bbautomatizaci\u00f3n\u00bb Pruebas de automatizaci\u00f3n \/li&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li Pruebas de rendimiento \/li&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li Pruebas manuales \/li&gt;<\/strong><\/p>\n\n<p><strong>&lt;\/ul&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; li#automatizaci\u00f3n + li<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; &#8216;li#automatizacion + li&#8217; va primero al elemento li con id &#8216;automatizacion&#8217; y luego selecciona su li vecino, t. j. Elemento de la lista \u00abPruebas de rendimiento\u00bb.<\/li>\n<\/ul>\n\n<p>Para procesar elementos din\u00e1micos cuyos ids y otros localizadores se generan din\u00e1micamente (no se conocen de antemano). Podemos explotar los localizadores anteriores utilizando diferentes relaciones padre-hermano de los elementos din\u00e1micos. Adem\u00e1s, tambi\u00e9n podemos utilizar algunos localizadores CSS especiales para asignar valores parciales a los atributos.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-zacina-sa-na\">^ &#8211; Comienza en<\/h2>\n\n<p><strong>Regla del selector CSS &#8211;  [attribute^=attributeValue]<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00bbuser1_btn_263&#8243; type=\u00bbbutton\u00bb class=\u00bbbtn\u00bb Enviar a \/button&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; id^=\u00bbusuario1\u2033<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; &#8216;id^=\u00bbusuario1\u2033&#8217; selecciona el elemento cuyo id empieza por \u00abusuario1<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-konci-sa-na\">$ &#8211; Termina en<\/h2>\n\n<p><strong>Regla del selector CSS &#8211;  [attribute$=attributeValue]<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00bbuser1_btn_263&#8243; type=\u00bbbutton\u00bb class=\u00bbbtn\u00bb Enviar \/button&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; id$=\u00bbbtn_263\u2033<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; &#8216;id$=\u00bbbtn_263\u2033&#8217; selecciona el elemento cuyo id termina en \u00abbtn_263<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-obsahuje\">* &#8211; Contiene<\/h2>\n\n<p><strong>Regla del selector CSS &#8211;  [attribute*=attributeValue]<\/strong><\/p>\n\n<p>Para la muestra HTML siguiente-<\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00bbuser1_btn_263&#8243; type=\u00bbbutton\u00bb class=\u00bbbtn\u00bb Enviar \/button&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localizador CSS &#8211; id*=\u00bbbtn\u00bb<\/li>\n\n\n\n<li>Descripci\u00f3n &#8211; &#8216;id*=\u00bbbtn\u00bb&#8216; selecciona el elemento cuyo id contiene el valor \u00abbtn\u00bb<\/li>\n<\/ul>\n\n<p>Eso es todo lo que hemos preparado en este art\u00edculo. El <a href=\"https:\/\/ittester.sk\/automatizovane-testovanie\/selenium-tutorial\/selenium-tutorial\/\">tutorial<\/a> completo <a href=\"https:\/\/ittester.sk\/automatizovane-testovanie\/selenium-tutorial\/selenium-tutorial\/\">de Selenium<\/a>.  <\/p>\n","protected":false},"excerpt":{"rendered":"<p>Utilizamos ciertas reglas proporcionadas como selectores CSS para encontrar los elementos web que hay que estilizar.  <\/p>\n","protected":false},"author":8,"featured_media":2034,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[39],"tags":[],"class_list":["post-2033","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorial-de-selenio"],"acf":[],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO Pro 4.9.10 - aioseo.com -->\n\t<meta name=\"description\" content=\"Utilizamos ciertas reglas, proporcionadas como selectores CSS, para encontrar los elementos web a los que aplicar estilo.\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"Zoltan\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/ittester.sk\/es\/sin-categorizar\/tutorial-de-selenio\/css-selectores\/\" \/>\n\t<meta name=\"generator\" content=\"All in One SEO Pro (AIOSEO) 4.9.10\" \/>\n\t\t<meta property=\"og:locale\" content=\"es_ES\" \/>\n\t\t<meta property=\"og:site_name\" content=\"IT tester - Z\u00e1kladn\u00e9 inform\u00e1cie o testovan\u00ed softv\u00e9ru\" \/>\n\t\t<meta property=\"og:type\" content=\"article\" \/>\n\t\t<meta property=\"og:title\" content=\"Selectores CSS - IT tester\" \/>\n\t\t<meta property=\"og:description\" content=\"Utilizamos ciertas reglas, proporcionadas como selectores CSS, para encontrar los elementos web a los que aplicar estilo.\" \/>\n\t\t<meta property=\"og:url\" content=\"https:\/\/ittester.sk\/es\/sin-categorizar\/tutorial-de-selenio\/css-selectores\/\" \/>\n\t\t<meta property=\"article:published_time\" content=\"2023-12-01T11:40:47+00:00\" \/>\n\t\t<meta property=\"article:modified_time\" content=\"2024-06-25T14:02:04+00:00\" \/>\n\t\t<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n\t\t<meta name=\"twitter:title\" content=\"Selectores CSS - IT tester\" \/>\n\t\t<meta name=\"twitter:description\" content=\"Utilizamos ciertas reglas, proporcionadas como selectores CSS, para encontrar los elementos web a los que aplicar estilo.\" \/>\n\t\t<script type=\"text\/javascript\">\n\t\t\t(function(c,l,a,r,i,t,y){\n\t\t\tc[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};t=l.createElement(r);t.async=1;\n\t\t\tt.src=\"https:\/\/www.clarity.ms\/tag\/\"+i+\"?ref=aioseo\";y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);\n\t\t})(window, document, \"clarity\", \"script\", \"nizijct9c2\");\n\t\t<\/script>\n\t\t<!-- All in One SEO Pro -->\r\n\t\t<title>Selectores CSS - IT tester<\/title>\n\n","aioseo_head_json":{"title":"Selectores CSS - IT tester","description":"Utilizamos ciertas reglas, proporcionadas como selectores CSS, para encontrar los elementos web a los que aplicar estilo.","canonical_url":"https:\/\/ittester.sk\/es\/sin-categorizar\/tutorial-de-selenio\/css-selectores\/","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":null,"og:locale":"es_ES","og:site_name":"IT tester - Z\u00e1kladn\u00e9 inform\u00e1cie o testovan\u00ed softv\u00e9ru","og:type":"article","og:title":"Selectores CSS - IT tester","og:description":"Utilizamos ciertas reglas, proporcionadas como selectores CSS, para encontrar los elementos web a los que aplicar estilo.","og:url":"https:\/\/ittester.sk\/es\/sin-categorizar\/tutorial-de-selenio\/css-selectores\/","article:published_time":"2023-12-01T11:40:47+00:00","article:modified_time":"2024-06-25T14:02:04+00:00","twitter:card":"summary_large_image","twitter:title":"Selectores CSS - IT tester","twitter:description":"Utilizamos ciertas reglas, proporcionadas como selectores CSS, para encontrar los elementos web a los que aplicar estilo."},"aioseo_meta_data":{"post_id":"2033","title":null,"description":"Utilizamos ciertas reglas, proporcionadas como selectores CSS, para encontrar los elementos web a los que aplicar estilo.","keywords":null,"keyphrases":{"focus":{"keyphrase":"","score":0,"analysis":{"keyphraseInTitle":{"score":0,"maxScore":9,"error":1}}},"additional":[]},"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_url":null,"og_image_width":null,"og_image_height":null,"og_image_custom_url":null,"og_image_custom_fields":null,"og_video":"","og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_url":null,"twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_title":null,"twitter_description":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"none","isEnabled":true},"graphs":[]},"schema_type":"default","schema_type_options":null,"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":"-1","robots_max_videopreview":"-1","robots_max_imagepreview":"large","priority":null,"frequency":"default","local_seo":null,"seo_analyzer_scan_date":"2026-05-18 07:55:16","breadcrumb_settings":null,"limit_modified_date":false,"open_ai":"{\"title\":{\"suggestions\":[],\"usage\":0},\"description\":{\"suggestions\":[],\"usage\":0}}","ai":null,"created":"2024-06-25 14:02:04","updated":"2026-05-18 07:55:16"},"aioseo_breadcrumb":"<div class=\"aioseo-breadcrumbs\"><span class=\"aioseo-breadcrumb\">\n\t<a href=\"https:\/\/ittester.sk\/es\/\" title=\"Home\">Home<\/a>\n<\/span><span class=\"aioseo-breadcrumb-separator\">&raquo;<\/span><span class=\"aioseo-breadcrumb\">\n\t<a href=\"https:\/\/ittester.sk\/es\/sin-categorizar\/\" title=\"Sin categorizar\">Sin categorizar<\/a>\n<\/span><span class=\"aioseo-breadcrumb-separator\">&raquo;<\/span><span class=\"aioseo-breadcrumb\">\n\t<a href=\"https:\/\/ittester.sk\/es\/sin-categorizar\/tutorial-de-selenio\/\" title=\"Tutorial de selenio\">Tutorial de selenio<\/a>\n<\/span><span class=\"aioseo-breadcrumb-separator\">&raquo;<\/span><span class=\"aioseo-breadcrumb\">\n\tSelectores CSS\n<\/span><\/div>","aioseo_breadcrumb_json":[{"label":"Home","link":"https:\/\/ittester.sk\/es\/"},{"label":"Sin categorizar","link":"https:\/\/ittester.sk\/es\/sin-categorizar\/"},{"label":"Tutorial de selenio","link":"https:\/\/ittester.sk\/es\/sin-categorizar\/tutorial-de-selenio\/"},{"label":"Selectores CSS","link":"https:\/\/ittester.sk\/es\/sin-categorizar\/tutorial-de-selenio\/css-selectores\/"}],"_links":{"self":[{"href":"https:\/\/ittester.sk\/es\/wp-json\/wp\/v2\/posts\/2033","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ittester.sk\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ittester.sk\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ittester.sk\/es\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/ittester.sk\/es\/wp-json\/wp\/v2\/comments?post=2033"}],"version-history":[{"count":1,"href":"https:\/\/ittester.sk\/es\/wp-json\/wp\/v2\/posts\/2033\/revisions"}],"predecessor-version":[{"id":2035,"href":"https:\/\/ittester.sk\/es\/wp-json\/wp\/v2\/posts\/2033\/revisions\/2035"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ittester.sk\/es\/wp-json\/wp\/v2\/media\/2034"}],"wp:attachment":[{"href":"https:\/\/ittester.sk\/es\/wp-json\/wp\/v2\/media?parent=2033"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ittester.sk\/es\/wp-json\/wp\/v2\/categories?post=2033"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ittester.sk\/es\/wp-json\/wp\/v2\/tags?post=2033"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}