{"id":93,"date":"2022-11-15T18:39:01","date_gmt":"2022-11-15T18:39:01","guid":{"rendered":"http:\/\/javigomez.org\/?p=93"},"modified":"2025-09-29T20:34:30","modified_gmt":"2025-09-29T20:34:30","slug":"utilizar-una-fuente-que-no-sea-de-sistema-en-tu-html-fuente-en-una-url","status":"publish","type":"post","link":"https:\/\/javigomez.org\/index.php\/2022\/11\/15\/utilizar-una-fuente-que-no-sea-de-sistema-en-tu-html-fuente-en-una-url\/","title":{"rendered":"Utilizar una fuente que no sea de sistema en tu HTML (fuente en una URL)"},"content":{"rendered":"\n<p>En este caso vamos a utilizar la fuente schoolbell dentro de Google Fonts (https:\/\/fonts.google.com\/)<\/p>\n\n\n\n<p>En la parte inferior del detalle de la fuente, vemos un enlace que pone &#8220;Select Regular 400&#8221;<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"http:\/\/javigomez.org\/wp-content\/uploads\/2022\/11\/image-29-1-14-1-1024x356.png\" alt=\"\" class=\"wp-image-94\"\/><\/figure>\n\n\n\n<p>En la parte derecha se abre una capa en donde si seleccionamos la opci\u00f3n &#8220;@import&#8221;, nos pone el c\u00f3digo que tenemos que colocar en la CSS, tanto para importar la fuente, como para poderla utilizar en el HTML<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"http:\/\/javigomez.org\/wp-content\/uploads\/2022\/11\/image-29-1-16-1.png\" alt=\"\" class=\"wp-image-96\"\/><\/figure>\n\n\n\n<p>A continuaci\u00f3n se muestra como queda el c\u00f3digo<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!doctype html>\n&lt;html>\n\n&lt;head>\n\t&lt;meta charset=\"utf-8\">\n\t&lt;title>Fuente&lt;\/title>\n\t&lt;link rel=\"stylesheet\" href=\"DI_U2_4Fonts_ext.css\">\n&lt;\/head>\n\n&lt;body>\n\n\t&lt;div id=\"fuente\">\n\t\tTexto con la fuente school\n\t&lt;\/div>\n\t&lt;div>\n\t\tTexto sin la fuente school\n\t&lt;\/div>\n&lt;\/body>\n&lt;\/html><\/code><\/pre>\n\n\n\n<pre class=\"wp-block-code\"><code>@import url('https:\/\/fonts.googleapis.com\/css2?family=Schoolbell&amp;display=swap');\n  #fuente{\n\tfont-family: Schoolbell;\n    font-size: 25px;\n  }<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>En este caso vamos a utilizar la fuente schoolbell dentro de Google Fonts (https:\/\/fonts.google.com\/) En la parte inferior del detalle de la fuente, vemos un &hellip; <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[16,106,160,165],"class_list":["post-93","post","type-post","status-publish","format-standard","hentry","category-css","tag-import","tag-css","tag-fonts","tag-fuente"],"_links":{"self":[{"href":"https:\/\/javigomez.org\/index.php\/wp-json\/wp\/v2\/posts\/93","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/javigomez.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/javigomez.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/javigomez.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/javigomez.org\/index.php\/wp-json\/wp\/v2\/comments?post=93"}],"version-history":[{"count":1,"href":"https:\/\/javigomez.org\/index.php\/wp-json\/wp\/v2\/posts\/93\/revisions"}],"predecessor-version":[{"id":986,"href":"https:\/\/javigomez.org\/index.php\/wp-json\/wp\/v2\/posts\/93\/revisions\/986"}],"wp:attachment":[{"href":"https:\/\/javigomez.org\/index.php\/wp-json\/wp\/v2\/media?parent=93"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/javigomez.org\/index.php\/wp-json\/wp\/v2\/categories?post=93"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/javigomez.org\/index.php\/wp-json\/wp\/v2\/tags?post=93"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}