{"json_modified": "2015-10-18T07:38:44.045701", "slug": "Web/Guide/HTML/Forms/Styling_HTML_forms", "tags": ["guide", "CSS", "Forms", "web", "forms", "Web", "Example", "Guide", "Intermediate", "HTML"], "locale": "ja", "title": "HTML \u30d5\u30a9\u30fc\u30e0\u3078\u306e\u30b9\u30bf\u30a4\u30eb\u8a2d\u5b9a", "translations": [{"title": "Styling HTML forms", "url": "/en-US/docs/Web/Guide/HTML/Forms/Styling_HTML_forms", "tags": ["CSS", "Forms", "Web", "Example", "Guide", "Intermediate", "HTML"], "summary": "In this article, we will learn how to use <a href=\"/en-US/docs/CSS\" title=\"/en-US/docs/CSS\">CSS</a> with <a href=\"/en-US/docs/HTML\" title=\"/en-US/docs/HTML\">HTML</a> forms to make them (hopefully) more beautiful. Surprisingly, this can be a little bit tricky. For historical and technical reasons, form widgets don't mesh well with CSS. Because of those difficulties, many developers choose to <a href=\"/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets\" title=\"/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets\">build their own HTML widgets</a> to gain control over their look and feel. However, with modern browsers web designers have more and more control over the design of form elements. Let's dig into it.", "localization_tags": [], "locale": "en-US", "last_edit": "2015-01-05T13:54:25", "review_tags": []}, {"title": "Apparence des formulaires HTML", "url": "/fr/docs/Web/Guide/HTML/Formulaires/Apparence_des_formulaires_HTML", "tags": ["Formulaires", "HTML"], "summary": "Dans cet article, nous allons apprendre comment utiliser <a href=\"/fr/docs/CSS\" title=\"/fr/docs/CSS\">CSS</a> avec les formulaires <a href=\"/fr/docs/HTML\" title=\"/fr/docs/HTML\">HTML</a> pour (esp\u00e9rons-le) am\u00e9liorer leur apparence. \u00c9tonnament, ceci peut \u00eatre d\u00e9licat. Pour des raisons techniques et historiques, les blocs de formulaires ne s'allient pas tr\u00e8s bien avec CSS. \u00c0 cause de ces difficult\u00e9s, de nombreux d\u00e9veloppeurs pr\u00e9f\u00e8rent <a href=\"/fr/docs/HTML/Formulaires/Comment_cr&#xE9;er_des_blocs_de_formulaires_personnalis&#xE9;s\" title=\"/fr/docs/HTML/Formulaires/Comment_cr&#xE9;er_des_blocs_de_formulaires_personnalis&#xE9;s\">construire leurs propres blocs HTML</a> pour avoir plus de ma\u00eetrise sur leur apparence. Toutefois, avec les navigateurs modernes, les web designers ont de plus en plus d'emprise sur l'apparence de leurs formulaires. Voyons cela de plus pr\u00e8s.", "localization_tags": [], "locale": "fr", "last_edit": "2013-06-05T22:31:44", "review_tags": []}, {"title": "Estilizando formularios HTML", "url": "/es/docs/Web/Guide/HTML/Forms/Styling_HTML_forms", "tags": [], "summary": "En este art\u00edculo aprenderemos como utilizar\u00a0<a href=\"/es/docs/Web/CSS\">CSS</a>\u00a0con formularios\u00a0<a href=\"/es/docs/Web/HTML\">HTML</a>\u00a0 para hacerlos m\u00e1s atractivos. Aunque parezca extra\u00f1o, esto es algo que puede llegar a ser complicado. Por razones hist\u00f3ricas y t\u00e9cnicas, los widgets de formulario no suelen llevarse bien con CSS. Por este motivo, muchos desarrolladores prefieren <a href=\"https://developer.mozilla.org/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets\">construir sus propios widgets</a>\u00a0para tener el control de su aspecto en vez de utilizar los nativos. De todas formas, con los modernos navegadores, los dise\u00f1adores web\u00a0<span style=\"line-height: 23.3333339691162px;\">cada vez</span><span style=\"line-height: 1.5;\">\u00a0tienen \u00a0m\u00e1s control sobre el dise\u00f1o de los elementos de formulario.\u00a0Vamos\u00a0a profundizar en esto.</span>", "localization_tags": [], "locale": "es", "last_edit": "2015-04-27T03:12:43", "review_tags": ["editorial"]}], "modified": "2015-10-18T07:38:43", "label": "HTML \u30d5\u30a9\u30fc\u30e0\u3078\u306e\u30b9\u30bf\u30a4\u30eb\u8a2d\u5b9a", "localization_tags": [], "url": "/ja/docs/Web/Guide/HTML/Forms/Styling_HTML_forms", "last_edit": "2015-10-18T07:38:39", "summary": "\u672c\u8a18\u4e8b\u3067\u306f\u3001<a href=\"/ja/docs/HTML\" title=\"HTML\">HTML</a> \u30d5\u30a9\u30fc\u30e0\u3092 (\u3067\u304d\u308c\u3070) \u3088\u308a\u7f8e\u3057\u304f\u3059\u308b\u305f\u3081\u306b <a href=\"/ja/docs/CSS\" title=\"CSS\">CSS</a> \u3092\u4f7f\u7528\u3059\u308b\u65b9\u6cd5\u3092\u5b66\u3073\u307e\u3059\u3002\u610f\u5916\u306b\u3082\u3001\u3053\u308c\u306f\u5c11\u3057\u30b3\u30c4\u304c\u3044\u308a\u307e\u3059\u3002\u6b74\u53f2\u7684\u3084\u6280\u8853\u7684\u306a\u7406\u7531\u306b\u3088\u308a\u3001\u30d5\u30a9\u30fc\u30e0\u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u306f CSS \u3068\u3046\u307e\u304f\u304b\u307f\u5408\u3044\u307e\u305b\u3093\u3002\u3053\u306e\u3088\u3046\u306a\u96e3\u3057\u3055\u304b\u3089\u3001\u591a\u304f\u306e\u958b\u767a\u8005\u306f\u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u306e\u30eb\u30c3\u30af\u30a2\u30f3\u30c9\u30d5\u30a3\u30fc\u30eb\u3092\u30b3\u30f3\u30c8\u30ed\u30fc\u30eb\u3067\u304d\u308b\u3088\u3046\u306b\u3059\u308b\u305f\u3081\u306b\u3001<a href=\"/ja/docs/HTML/Forms/How_to_build_custom_form_widgets\" title=\"HTML/Forms/How_to_build_custom_form_widgets\">\u72ec\u81ea\u306e HTML \u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u3092\u4f5c\u6210</a>\u3059\u308b\u3053\u3068\u3092\u9078\u629e\u3057\u307e\u3059\u3002\u3057\u304b\u3057\u73fe\u4ee3\u306e\u30d6\u30e9\u30a6\u30b6\u3067\u306f\u3001Web \u30c7\u30b6\u30a4\u30ca\u30fc\u304c\u30d5\u30a9\u30fc\u30e0\u8981\u7d20\u306e\u30c7\u30b6\u30a4\u30f3\u3092\u3088\u308a\u591a\u304f\u30b3\u30f3\u30c8\u30ed\u30fc\u30eb\u3067\u304d\u307e\u3059\u3002\u8a73\u3057\u304f\u898b\u3066\u3044\u304d\u307e\u3057\u3087\u3046\u3002", "sections": [{"id": "Why_is_it_so_hard_to_style_form_widgets_with_CSS", "title": "\u306a\u305c CSS \u306b\u3088\u308b\u30d5\u30a9\u30fc\u30e0\u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u3078\u306e\u30b9\u30bf\u30a4\u30eb\u8a2d\u5b9a\u306f\u56f0\u96e3\u3067\u3042\u308b\u304b?"}, {"id": "Not_all_widgets_are_created_equal_when_CSS_is_involved", "title": "CSS \u3092\u4f34\u3063\u3066\u3082\u3059\u3079\u3066\u306e\u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u304c\u540c\u7b49\u306b\u306f\u4f5c\u6210\u3055\u308c\u307e\u305b\u3093"}, {"id": "The_good", "title": "\u826f\u597d"}, {"id": "The_bad", "title": "\u4e0d\u826f"}, {"id": "The_ugly", "title": "\u52a3\u60aa"}, {"id": "Basic_styling", "title": "\u57fa\u672c\u7684\u306a\u30b9\u30bf\u30a4\u30eb\u8a2d\u5b9a"}, {"id": "Search_fields", "title": "\u691c\u7d22\u30d5\u30a3\u30fc\u30eb\u30c9"}, {"id": "Example", "title": "\u4f8b"}, {"id": "Fonts_and_text", "title": "\u30d5\u30a9\u30f3\u30c8\u3068\u30c6\u30ad\u30b9\u30c8"}, {"id": "Box_model", "title": "\u30dc\u30c3\u30af\u30b9\u30e2\u30c7\u30eb"}, {"id": "Positioning", "title": "\u30dd\u30b8\u30b7\u30e7\u30cb\u30f3\u30b0"}, {"id": "legend", "title": "legend"}, {"id": "HTML", "title": "HTML"}, {"id": "CSS", "title": "CSS"}, {"id": "textarea", "title": "textarea"}, {"id": "Example_2", "title": "\u4f8b"}, {"id": "HTML_2", "title": "HTML"}, {"id": "CSS_2", "title": "CSS"}, {"id": "Conclusion", "title": "\u304a\u308f\u308a\u306b"}], "id": 65095, "review_tags": []}