<!--html\u7bc4\u4f8b [radio\u3001checkbox\u3001select]-->\n\n<div>\n <input type=\"radio\" name=\"my-input\" id=\"yes\">\n <label for=\"yes\">Yes<\/label>\n\n <input type=\"radio\" name=\"my-input\" id=\"no\">\n <label for=\"no\">No<\/label>\n<\/div>\n\n<div>\n <input type=\"checkbox\" name=\"my-checkbox\" id=\"opt-in\">\n <label for=\"opt-in\">Check me!<\/label>\n<\/div>\n\n<select name=\"my-select\" id=\"fruit\">\n <option value=\"opt1\">Apples<\/option>\n <option value=\"opt2\">Grapes<\/option>\n <option value=\"opt3\">Pears<\/option>\n<\/select><\/pre>\n\n\n\n\/* css\u7bc4\u4f8b [radio\u3001checkbox\u3001select] *\/\n\ndiv,\nselect {\n margin: 8px;\n}\n\n\/* Labels for checked inputs *\/\ninput:checked + label {\n color: red;\n}\n\n\/* Radio element, when checked *\/\ninput[type=\"radio\"]:checked {\n box-shadow: 0 0 0 3px orange;\n}\n\n\/* Checkbox element, when checked *\/\ninput[type=\"checkbox\"]:checked {\n box-shadow: 0 0 0 3px hotpink;\n}\n\n\/* Option elements, when selected *\/\noption:checked {\n box-shadow: 0 0 0 3px lime;\n color: red;\n}<\/pre>\n\n\n\n:disabled<\/h2>\n\n\n\n
\u7981\u7528\u5143\u7d20\u6a23\u5f0f\uff0cselected, clicked on, typed into…<\/p>\n\n\n\n
<!--Html\u7bc4\u4f8b-->\n\n<input type=\"text\" placeholder=\"Name\" disabled>\n\n<select>\n <option value=\"volvo\">Volvo<\/option>\n <option value=\"saab\" disabled>Saab<\/option>\n <option value=\"opel\">Opel<\/option>\n <option value=\"audi\" disabled>Audi<\/option>\n <option value=\"bmw\">BMW<\/option>\n<\/select><\/pre>\n\n\n\n\/* css\u7bc4\u4f8b *\/\n\ninput[type=\"text\"]:disabled {\n background: #ccc;\n}\noption:disabled {\n background: red;\n}<\/pre>\n\n\n\n:enabled<\/h2>\n\n\n\n
\u4f7f\u7528\u5143\u7d20\u6a23\u5f0f\uff0cselected, clicked on, typed into\u2026<\/p>\n\n\n\n
<!--Html\u7bc4\u4f8b-->\n\n<input type=\"text\" value=\"Mickey\"><!--\u4f7f\u7528\u4e2d-->\n<input type=\"text\" disabled=\"disabled\" value=\"Disneyland\"><!--\u7981\u7528\u4e2d--><\/pre>\n\n\n\n\/* css\u7bc4\u4f8b *\/\n\ninput[type=text]:enabled {\n background: #ffff00;\n}\n\ninput[type=text]:disabled {\n background: #dddddd;\n}<\/pre>\n\n\n\n:empty<\/h2>\n\n\n\n
\u70ba\u7a7a\u5143\u7d20\u6307\u5b9a\u6a23\u5f0f<\/p>\n\n\n\n
<!--Html\u7bc4\u4f8b-->\n\n<div class=\"box\"><!-- \u6b64\u5340\u584a\u70ba\u7a7a\u5143\u7d20= lime--><\/div>\n<div class=\"box\">\u6b64\u5340\u584a\u6709\u7d14\u6587\u5b57 = pink<\/div>\n<div class=\"box\">\n\t<!-- \u6b64\u5340\u584a\u8a3b\u89e3\u6709\u7a7a\u767d\u6216\u6bb5\u884c\uff0c\u820a\u700f\u89bd\u5668\u6703\u5224\u65b7\u6709\u5143\u7d20\uff0c\u800c\u4f7f\u7528 pink -->\n<\/div>\n<div class=\"box\">\n\t<p><!-- \u6b21\u5340\u584a\u6709\u5143\u7d20<p> = pink --><\/p>\n<\/div><\/pre>\n\n\n\n\/* css\u7bc4\u4f8b *\/\n\n.box {\n background: pink;\n height: 80px;\n width: 80px;\n}\n\n.box:empty {\n background: lime;\n}<\/pre>\n\n\n\n:in-range \u8207 :out-of-range<\/h2>\n\n\n\n
:in-range<\/strong> <input>\u5143\u7d20\u503c\u5728min\u548cmax\u5c6c\u6027\u6307\u5b9a\u7684\u7bc4\u570d\u9650\u5236\u5167\uff0c\u8a2d\u8a08\u6a23\u5f0f\u3002
:out-of-range<\/strong> <input>\u5143\u7d20\u503c\u5728min\u548cmax\u5c6c\u6027\u6307\u5b9a\u7684\u7bc4\u570d\u9650\u5236\u5916\uff0c\u8a2d\u8a08\u6a23\u5f0f\u3002<\/p>\n\n\n\n<!--Html\u7bc4\u4f8b-->\n\n<input id=\"value1\" name=\"value1\" type=\"number\" placeholder=\"1 to 10\" min=\"1\" max=\"10\" value=\"12\" required><\/pre>\n\n\n\n\/* css\u7bc4\u4f8b *\/\n\ninput {\n border: 1px solid black;\n}\n\ninput:in-range {\n background-color: rgba(0, 255, 0, 0.25);\n}\n\ninput:out-of-range {\n background-color: rgba(255, 0, 0, 0.25);\n border: 2px solid red;\n}\n\ninput:in-range + label::after {\n content: 'okay.';\n}\n\ninput:out-of-range + label::after {\n content: 'out of range!';\n}<\/pre>\n\n\n\n:lang(language-code)<\/h2>\n\n\n\n
\u6307\u5b9a\u5143\u7d20\u503c\uff0c\u4e26\u8a2d\u5b9a\u6a23\u5f0f<\/p>\n\n\n\n
<p lang=\"it\">Ciao bella!<\/p><\/pre>\n\n\n\np:lang(it) { \n background: yellow;\n}<\/pre>\n\n\n\n:first-child \u8207 :last-child<\/h2>\n\n\n\n
:first-child<\/strong> \u8a2d\u5b9a\u7b2c1\u500b\u5143\u7d20\u6a23\u5f0f
:last-child<\/strong> \u8a2d\u5b9a\u5012\u6578\u7b2c1\u5143\u7d20\u6a23\u5f0f<\/p>\n\n\n\n<!--Html\u7bc4\u4f8b-->\n\n<div>\n <p>\u6211\u662f<p>\u5143\u7d20\u7b2c\u4e00\u884c\uff0c\u5957\u7528\u6a23\u5f0f<\/p>\n <p>\u6211\u662f<p>\u5143\u7d20\u7b2c\u4e8c\u884c\uff0c\u7121\u6a23\u5f0f<\/p>\n<\/div>\n\n<div>\n <h2>\u6211\u662f<h2>\u5143\u7d20\u7b2c\u4e00\u884c\uff0c\u7121\u6a23\u5f0f<\/h2>\n <p>\u6211\u662f<p>\u5143\u7d20\u7b2c\u4e09\u884c\uff0c\u7121\u6a23\u5f0f<\/p>\n<\/div>\n<\/pre>\n\n\n\n\/* css\u7bc4\u4f8b *\/\n\np:first-child {\n color: lime;\n background-color: black;\n padding: 5px;\n}<\/pre>\n\n\n\n:first-of-type \u8207 :last-of-type<\/h2>\n\n\n\n
:first-of-type<\/strong> \u8a2d\u5b9a\u4e0d\u540c\u5340\u584a\u88e1\uff0c\u540c\u4e00\u5c64\u7b2c1\u500b\u5143\u7d20\u6a23\u5f0f
:last-of-type<\/strong> \u8a2d\u5b9a\u4e0d\u540c\u5340\u584a\u88e1\uff0c\u540c\u4e00\u5c64\u5012\u6578\u7b2c1\u5143\u7d20\u6a23\u5f0f<\/p>\n\n\n\n<!--Html\u7bc4\u4f8b-->\n\n<article>\n <div>\u6211\u662f\u7b2c1\u500b\"div\"\u5143\u7d20\uff0c\u5957\u7528\u6a23\u5f0f\u3002<\/div>\n \n <div>\u7b2c2\u500b\"div\"\u5143\u7d20\uff0c<span>\u6211\u662f\u7b2c\u4e00\u500b\"span\"\u5143\u7d20\uff0c\u5957\u7528\u6a23\u5f0f\u3002<\/span><\/div>\n \n <div>\u7b2c3\u500b\"div\"\u5143\u7d20\uff0c<em>\u6211\u662f\u7b2c1\u500b\"em\"\u5143\u7d20\uff0c\u5957\u7528\u6a23\u5f0f\u3002<\/em>, \u53e6\u5916<em>\u6211\u662f\u7b2c2\u500b\"em\"\u5143\u7d20\uff0c\u7121\u6a23\u5f0f\u3002<\/em><\/div>\n \n <div>\u7b2c4\u500b\"div\"\u5143\u7d20\uff0c<span>\u6211\u662f\"div\"\u4e2d\"span\"\u7684\u7b2c\u4e00\u500b\u5143\u7d20\uff0c\u5957\u7528\u6a23\u5f0f\u3002<\/span><\/div>\n \n <b>\u7b2c1\u500b\"b\"\u5143\u7d20\uff0c\u5957\u7528\u6a23\u5f0f\u3002<\/b>\n \n <div>\u7b2c5\u500b\"div\"\u5143\u7d20\uff0c\u7121\u6a23\u5f0f\u3002<\/div>\n<\/article><\/pre>\n\n\n\n\/* css\u7bc4\u4f8b *\/\n\narticle :first-of-type {\n background-color: pink;\n}<\/pre>\n\n\n\n:nth-child() \u8207 :nth-last-child()<\/h2>\n\n\n\n
\u9078\u64c7\u7236\u5143\u7d20\u5167\u7b2cn\u500b\u5143\u7d20
:nth-child(2)<\/strong> \u8a2d\u5b9a\u7b2cn\u500b\u5143\u7d20\u6a23\u5f0f
:nth-child(odd)<\/strong> \u8a2d\u5b9a\u55ae\u6578\u5143\u7d20\u6a23\u5f0f
:nth-child(even)<\/strong> \u8a2d\u5b9a\u96d9\u6578\u5143\u7d20\u6a23\u5f0f
:nth-last-child\u70ba\u5012\u6578\u8a08\u7b97<\/p>\n\n\n\n\/* css\u7bc4\u4f8b *\/\n\np:nth-child(2) {\n background: red;\n}\n\np:nth-child(odd) {\n background: red;\n}\n\np:nth-child(even) {\n background: blue;\n}<\/pre>\n\n\n\n(n) An+B<\/strong> \u6307\u5b9a\u5143\u7d20<\/h3>\n\n\n\nAn + B\u81ea\u5b9a\u7fa9\u6578\u5b57\uff1a
A=\u5faa\u74b0\u6578(\u7d44)
n=\u5f9e0\u958b\u59cb(\u8a08\u6578\u5668)
B=\u5faa\u74b0\u6578\u7bc4\u570d\u5167\u7684\u7b2cn\u500b\u5143\u7d20(\u504f\u79fb\u503c)
<\/p>\n\n\n\n
\u7bc4\u4f8b\u8aaa\u660e<\/h4>\n\n\n\n
p:nth-child(n)<\/strong> = \u6bcf\u500b<p>\u5143\u7d20
nth-child(2n+1)<\/strong> = 2\u5143\u7d20\u5faa\u74b0\u7d44\u7684\u7b2c1\u500b\u5143\u7d20 = nth-child(odd)
nth-child(2n)<\/strong> = 2\u5143\u7d20\u5faa\u74b0\u7d44\u7684\u7b2c2\u500b\u5143\u7d20 =nth-child(even)
nth-child(5n)<\/strong> = 5\u5143\u7d20\u5faa\u74b0\u7d44\u7684\u7b2c5\u500b\u5143\u7d20
nth-child(n+7)<\/strong> = \u7b2c7\u500b\u5143\u7d20\u8207\u4ee5\u4e0b\u6240\u6709\u5143\u7d20
nth-child(-n+3)<\/strong> = \u7b2c3\u500b\u5143\u7d20\u8207\u4ee5\u4e0a\u6240\u6709\u5143\u7d20
nth-child(3n+4)<\/strong> = 3\u5143\u7d20\u5faa\u74b0\u7d44\u4ee5\u4e0b\u7684\u7b2c4\u500b\u5143\u7d20
p:nth-child(1) or p:nth-child(0n+1)<\/strong> = \u7b2c1\u500b\u5143\u7d20 = first-child
p:nth-child(n+8):nth-child(-n+15)<\/strong> = \u7b2c8\u500b\u5143\u7d20\u4ee5\u4e0b\u5230\u7b2c15\u500b\u5143\u7d20\u4ee5\u4e0a = 8~15<\/p>\n\n\n\nPS.IE8\u4ee5\u4e0a\u652f\u63f4<\/p>\n\n\n\n
\/* css\u7bc4\u4f8b *\/\n\ntr:nth-child(1){\n background-color:#69C;\n }<\/pre>\n\n\n\n:nth-of-type() \u8207 :nth-last-of-type()<\/h2>\n\n\n\n
\u9078\u64c7\u7236\u5143\u7d20\u5167\u6307\u5b9a\u985e\u578b\u7b2cn\u500b\u5143\u7d20
:nth-of-type(<nth> )
where
= <an-plus-b> | even | odd
:nth-of-type(2)<\/strong> \u8a2d\u5b9a\u7b2cn\u500b\u5143\u7d20\u6a23\u5f0f
:nth-of-type(odd)<\/strong> \u8a2d\u5b9a\u55ae\u6578\u5143\u7d20\u6a23\u5f0f
:nth-of-type(even)<\/strong> \u8a2d\u5b9a\u96d9\u6578\u5143\u7d20\u6a23\u5f0f
:nth-last-of-type() \u70ba\u5012\u6578\u8a08\u7b97<\/p>\n\n\n\n\/* css\u7bc4\u4f8b *\/\n\n\/* Odd paragraphs *\/\np:nth-of-type(2n+1) {\n color: red;\n}\n\n\/* Even paragraphs *\/\np:nth-of-type(2n) {\n color: blue;\n}\n\n\/* First paragraph *\/\np:nth-of-type(1) {\n font-weight: bold;\n}\n\n\/* This has no effect, as the .fancy class is only on the 4th p element, not the 1st *\/\np.fancy:nth-of-type(1) {\n text-decoration: underline;\n}<\/pre>\n\n\n\n<!--html\u7bc4\u4f8b-->\n\n<div>\n <div>\u7121\u6548\u679c\u5957\u7528<\/div>\n <p>\u6211\u662fp:nth-of-type(1)\u7d50\u679c<\/p>\n <p>\u6211\u662fp:nth-of-type(2n)\u7d50\u679c<\/p>\n <div>\u7121\u6548\u679c\u5957\u7528<\/div>\n <p>\u6211\u662fp:nth-of-type(2n+1)\u7d50\u679c<\/p>\n <p class=\"fancy\">\u7121\u6548\u679c\u5957\u7528\uff0cp.fancy:nth-of-type(1)\u70ba\u7b2c1\u500bp\u5143\u7d20\uff0c\u672c.fancy\u5143\u7d20\u70ba\u7b2c4\u500bp\u5143\u7d20=p.fancy:nth-of-type(4)<\/p>\n<\/div><\/pre>\n\n\n\n:not(selector)<\/h2>\n\n\n\n
css3\u9078\u64c7\u5668\uff0c\u5957\u7528\u6307\u5b9a\u4ee5\u5916\u5143\u7d20\u6a23\u5f0f\u3002<\/p>\n\n\n\n
:not(.class)<\/h3>\n\n\n\n
\u6307\u5b9aclass\u4ee5\u5916\u5143\u7d20\u6a23\u5f0f\u3002<\/p>\n\n\n\n
\/* css\u7bc4\u4f8b *\/\n\ndiv {\n color: black;\n}\ndiv:not(.active) {\n color: green;\n}<\/pre>\n\n\n\n<!--html\u7bc4\u4f8b-->\n\n<div class=\"active\">\u6211\u662fblack\u6a23\u5f0f<\/div>\n<div>\u6211\u662fgreen\u6a23\u5f0f<\/div>\n<div>\u6211\u662fgreen\u6a23\u5f0f<\/div><\/pre>\n\n\n\n:not(.class):not(.class)<\/h3>\n\n\n\n
\u6307\u5b9a\u96d9\u91cdclass\u4ee5\u5916\u5143\u7d20\u6a23\u5f0f\u3002<\/p>\n\n\n\n
\/* css\u7bc4\u4f8b *\/\n\ndiv {\n color: black;\n}\ndiv:not(.active1) :not(.active2) {\n color: green;\n}<\/pre>\n\n\n\n<!--html\u7bc4\u4f8b-->\n\n<div class=\"active1\">\u6211\u662fblack\u6a23\u5f0f<\/div>\n<div>\u6211\u662fgreen\u6a23\u5f0f<\/div>\n<div class=\"active2\">\u6211\u662fblack\u6a23\u5f0f<\/div><\/pre>\n\n\n\n:not(:first-child) <\/h3>\n\n\n\n
\u7b2c1\u500b\u5143\u7d20\u4ee5\u5916\u5143\u7d20\u6a23\u5f0f\u3002<\/p>\n\n\n\n
\/* css\u7bc4\u4f8b *\/\n\nul li{ \n color:#000000;\n}\nul li:not(:first-child){ \n color:#red;\n}<\/pre>\n\n\n\n<!--html\u7bc4\u4f8b-->\n\n<ul>\n <li>\u5217\u88681 \u6211\u662f\u9ed1\u8272<\/li>\n <li>\u5217\u88682 \u6211\u662f\u7d05\u8272<\/li>\n <li>\u5217\u88683 \u6211\u662f\u7d05\u8272<\/li>\n<\/ul><\/pre>\n\n\n\n:only-child<\/h2>\n\n\n\n
\u7236\u5143\u7d20\u5167\u6307\u5b9a\u985e\u578b\uff0c\u4e26\u50c5\u67091\u500b\u6307\u5b9a\u985e\u578b\u5143\u7d20\uff0c\u624d\u6703\u6709\u6a23\u5f0f\uff0c\u5982\u7236\u5143\u7d20\u6709\u5176\u4ed6\u985e\u578b\u5143\u7d20\u6216\u6709\u7b2c2\u500b\u6307\u5b9a\u5143\u7d20\uff0c\u4e5f\u4e0d\u6703\u6709\u6a23\u5f0f<\/p>\n\n\n\n
\/* css\u7bc4\u4f8b *\/\np:only-child {\n background: red;\n}<\/pre>\n\n\n\n<!--html\u7bc4\u4f8b-->\n\n<div><p>1\u500b\u6307\u5b9a\u5143\u7d20\uff0c\u5957\u7528\u6a23\u5f0f<\/p><\/div>\n<div><p>This is a paragraph.<\/p><p>This is a paragraph.<\/p>2\u7a2e\u6307\u5b9a\u5143\u7d20\uff0c\u7121\u5957\u7528\u6a23\u5f0f<\/div>\n<div><span>This is a span.<\/span><p>This is a paragraph.<\/p>2\u7a2e\u985e\u578b\u5143\u7d20\uff0c2\u7a2e\u985e\u578b\u5143\u7d20\u4e2d\u67091\u500b\u6307\u5b9a\u5143\u7d20\uff0c\u7121\u5957\u7528\u6a23\u5f0f<\/div><\/pre>\n\n\n\n:only-of-type<\/h2>\n\n\n\n
\u7236\u5143\u7d20\u5167\u6307\u5b9a\u985e\u578b\uff0c\u4e26\u50c5\u55ae1\u500b\u6307\u5b9a\u985e\u578b\u5143\u7d20\uff0c\u624d\u6703\u6709\u6a23\u5f0f\uff0c\u5982\u7236\u5143\u7d20\u6709\u5176\u4ed6\u985e\u578b\u5143\u7d20\uff0c\u4f46\u6709\u55ae1\u500b\u6307\u5b9a\u5143\u7d20\uff0c\u540c\u6a23\u6703\u91dd\u5c0d\u8a72\u985e\u578b\u5957\u7528\u6a23\u5f0f\uff0c\u5982\u6709\u7b2c2\u500b\u6307\u5b9a\u5143\u7d20\uff0c\u5247\u4e0d\u6703\u5957\u7528\u6a23\u5f0f<\/p>\n\n\n\n
\/* css\u7bc4\u4f8b *\/\n\np:only-of-type {\n background: red;\n}<\/pre>\n\n\n\n<!--html\u7bc4\u4f8b-->\n\n<div><p>1\u500b\u6307\u5b9a\u5143\u7d20\uff0c\u5957\u7528\u6a23\u5f0f<\/p><\/div>\n<div><p>This is a paragraph.<\/p><p>This is a paragraph.<\/p>2\u7a2e\u6307\u5b9a\u5143\u7d20\uff0c\u7121\u5957\u7528\u6a23\u5f0f<\/div>\n<div><span>This is a span.<\/span><p>This is a paragraph.<\/p>2\u7a2e\u985e\u578b\u5143\u7d20\uff0c2\u7a2e\u985e\u578b\u5143\u7d20\u4e2d\u67091\u500b\u6307\u5b9a\u5143\u7d20\uff0c\u5957\u7528\u6a23\u5f0f<\/div><\/pre>\n\n\n\n:optional<\/h2>\n\n\n\n
\u9078\u64c7\u8868\u55ae\u5167\u6c92\u8a2d\u5b9a\u5fc5\u586b(required)\u5c6c\u6027\uff0c\u5957\u7528\u6a23\u5f0f\uff0c\u9069\u7528\u65bc<input>\u3001<select>\u3001<textarea><\/p>\n\n\n\n
\/* css\u7bc4\u4f8b *\/\n\nlabel {\n display: block;\n margin: 1px; \n padding: 1px;\n}\n\n.field {\n margin: 1px;\n padding: 1px;\n}\n \ninput:optional {\n border-color: rebeccapurple;\n border-width: 3px;\n}<\/pre>\n\n\n\n<!--html\u7bc4\u4f8b-->\n\n<form>\n <div class=\"field\">\n <label for=\"url_input\">Enter a URL:<\/label>\n <input type=\"url\" id=\"url_input\"> \u975e\u5fc5\u586b\u5143\u7d20\uff0c\u5957\u7528\u6a23\u5f0f\n <\/div>\n\n <div class=\"field\">\n <label for=\"email_input\">Enter an email address:<\/label>\n <input type=\"email\" id=\"email_input\" required> \u5fc5\u586b\u5143\u7d20\uff0c\u7121\u5957\u7528\u6a23\u5f0f\n <\/div>\n<\/form><\/pre>\n\n\n\n:read-only \u8207 :read-write<\/h2>\n\n\n\n
:read-only<\/strong> \u9078\u64c7\u8868\u55ae\u5167\u4e0d\u53ef\u7de8\u8f2f(readonly)\u5143\u7d20
:read-write<\/strong> \u9078\u64c7\u8868\u55ae\u5167\u53ef\u7de8\u8f2f\u5143\u7d20
\u5957\u7528\u6a23\u5f0f\uff0c\u9069\u7528\u65bc<input>\u3001<textarea><\/p>\n\n\n\n\/* css\u7bc4\u4f8b *\/\n\ninput:-moz-read-only, textarea:-moz-read-only,\ninput:read-only, textarea:read-only {\n border: 0;\n box-shadow: none;\n background-color: white;\n}\n\ntextarea:-moz-read-write,\ntextarea:read-write {\n box-shadow: inset 1px 1px 3px #ccc;\n border-radius: 5px;\n}<\/pre>\n\n\n\n<!--html\u7bc4\u4f8b-->\n\n<form>\n \u672c\u8868\u55ae\u4e0d\u53ef\u7de8\u8f2f\uff0c\u5957\u7528:read-only\u6a23\u5f0f\n <input type=\"text\" value=\"\" readonly>\n <textarea name=\"address\" readonly><\/textarea>\n<\/form>\n\n<form>\n \u672c\u8868\u55ae\u53ef\u7de8\u8f2f\uff0c\u5957\u7528:read-write\u6a23\u5f0f\n <input type=\"text\" value=\"\">\n <textarea><\/textarea>\n<\/form><\/pre>\n\n\n\n:target<\/h2>\n\n\n\n
\u9ede\u9078\u9023\u7d50\u6a19\u7c64\uff0c\u5957\u7528\u9ede\u9078\u81f3\u6a19\u7c64\u5167\u5bb9\u7bc4\u570d\u6a23\u5f0f(url\u7684id)<\/p>\n\n\n\n
<!--html\u7bc4\u4f8b-->\n<p><a href=\"#news1\">\u9023\u7d50\u6a19\u7c64 1<\/a><\/p>\n<p><a href=\"#news2\">\u9023\u7d50\u6a19\u7c64 2<\/a><\/p>\n\n<p id=\"news1\"><b>\u9ede\u9078\u9023\u7d50\u6a19\u7c64\uff0c\u9019\u88e1\u6703\u986f\u793a\u5957\u7528\u6a23\u5f0f\u6548\u679c...<\/b><\/p>\n<p id=\"news2\"><b>\u9ede\u9078\u9023\u7d50\u6a19\u7c64\uff0c\u9019\u88e1\u6703\u986f\u793a\u5957\u7528\u6a23\u5f0f\u6548\u679c...<\/b><\/p><\/pre>\n\n\n\n\/* css\u7bc4\u4f8b *\/\n\n:target {\n border: 2px solid #D4D4D4;\n background-color: #e5eecc;\n}\n<\/pre>\n\n\n\n:first<\/h2>\n\n\n\n<!--html\u7bc4\u4f8b-->\n\n<p>First Page.<\/p>\n<p>Second Page.<\/p>\n<button>Print!<\/button><\/pre>\n\n\n\n\/* css\u7bc4\u4f8b *\/\n\n\/* Selects the first page when printing *\/\n@page :first {\n margin-left: 50%;\n margin-top: 50%;\n}\n\np {\n page-break-after: always;\n}<\/pre>\n","protected":false},"excerpt":{"rendered":":active \u6d3b\u52d5\u9023\u7d50\uff0c\u904b\u7528\u65bc\u6a19\u7c64\u9ede\u9078\u3002 :valid \u8207 :invalid :valid \u8a2d\u5b9a\u8868\u55ae\u9a57\u8b49\uff0c\u586b...<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13,12,4],"tags":[],"class_list":["post-2141","post","type-post","status-publish","format-standard","hentry","category-css","category-front-end","category-notes"],"_links":{"self":[{"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/posts\/2141","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/comments?post=2141"}],"version-history":[{"count":166,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/posts\/2141\/revisions"}],"predecessor-version":[{"id":2491,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/posts\/2141\/revisions\/2491"}],"wp:attachment":[{"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/media?parent=2141"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/categories?post=2141"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/tags?post=2141"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}