Um Webseiten zu analysieren bzw. \u00c4nderungen am CSS-Code leichter durchf\u00fchren und testen zu k\u00f6nnen verwenden ich die Tools der Browser. Das sind im Google Chrome die Entwicklertools, im Firefox der Webinspektor oder im Edge die Entwicklungstools (jeweils erreichbar \u00fcber das Men\u00fc des Browser oben rechts \u2013 drei Punkte neben- oder untereinander).<\/p>\n\n\n\n
Bisher wusste ich nicht dass man hier den Zustand eines Buttons fixieren kann, so dass man z.B. den CSS-Code f\u00fcr den hover-Effekt leichter herausfindet.<\/p>\n\n\n\n
Dazu w\u00e4hlt man in Chrome oder Edge unter Styles den Button \u201e:hov\u201c (neben Filter) oder im Firefox den Button mit den drei blauen Rechtecken. Hier kann man dann den gew\u00fcnschten Status des Elements anklicken und so den entsprechenden CSS-Code herausfinden.<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=“4.9.4″ _module_preset=“default“ global_module=“272″][et_pb_column type=“4_4″ _builder_version=“4.9.4″ _module_preset=“default“][et_pb_post_nav prev_text=“Vorheriger Artikel“ next_text=“N\u00e4chster Artikel“ _builder_version=“4.9.4″ _module_preset=“default“ title_text_color=“#FFFFFF“ background_color=“#2E4770″ custom_padding=“0.5em|0.5em|0.5em|0.5em|true|true“][\/et_pb_post_nav][\/et_pb_column][\/et_pb_row][\/et_pb_section]\n","protected":false},"excerpt":{"rendered":"
Um Webseiten zu analysieren bzw. \u00c4nderungen am CSS-Code leichter durchf\u00fchren und testen zu k\u00f6nnen verwenden ich die Tools der Browser. Das sind im Google Chrome die Entwicklertools, im Firefox der Webinspektor oder im Edge die Entwicklungstools (jeweils erreichbar \u00fcber das Men\u00fc des Browser oben rechts \u2013 drei Punkte neben- oder untereinander). Bisher wusste ich nicht […]<\/p>\n","protected":false},"author":1,"featured_media":93,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"\n
Um Webseiten zu analysieren bzw. \u00c4nderungen am CSS-Code leichter durchf\u00fchren und testen zu k\u00f6nnen verwenden ich die Tools der Browser. Das sind im Google Chrome die Entwicklertools, im Firefox der Webinspektor oder im Edge die Entwicklungstools (jeweils erreichbar \u00fcber das Men\u00fc des Browser oben rechts \u2013 drei Punkte neben- oder untereinander).<\/p>\n\n\n\n
Bisher wusste ich nicht dass man hier den Zustand eines Buttons fixieren kann, so dass man z.B. den CSS-Code f\u00fcr den hover-Effekt leichter herausfindet.<\/p>\n\n\n\n
Dazu w\u00e4hlt man in Chrome oder Edge unter Styles den Button \u201e:hov\u201c (neben Filter) oder im Firefox den Button mit den drei blauen Rechtecken. Hier kann man dann den gew\u00fcnschten Status des Elements anklicken und so den entsprechenden CSS-Code herausfinden.<\/p>\n","_et_gb_content_width":"","footnotes":""},"categories":[21],"tags":[33],"class_list":["post-194","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-aus-meiner-arbeit","tag-browser"],"_links":{"self":[{"href":"https:\/\/www.penzenauer.at\/blog\/wp-json\/wp\/v2\/posts\/194","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.penzenauer.at\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.penzenauer.at\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.penzenauer.at\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.penzenauer.at\/blog\/wp-json\/wp\/v2\/comments?post=194"}],"version-history":[{"count":4,"href":"https:\/\/www.penzenauer.at\/blog\/wp-json\/wp\/v2\/posts\/194\/revisions"}],"predecessor-version":[{"id":289,"href":"https:\/\/www.penzenauer.at\/blog\/wp-json\/wp\/v2\/posts\/194\/revisions\/289"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.penzenauer.at\/blog\/wp-json\/wp\/v2\/media\/93"}],"wp:attachment":[{"href":"https:\/\/www.penzenauer.at\/blog\/wp-json\/wp\/v2\/media?parent=194"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.penzenauer.at\/blog\/wp-json\/wp\/v2\/categories?post=194"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.penzenauer.at\/blog\/wp-json\/wp\/v2\/tags?post=194"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}