Nachdem ich die halbe Nacht daran gearbeitet hatte, gelang es mir endlich, den Stil des Blogs grob fertigzustellen. Code kopieren Der Code lautet wie folgt:<div id="myFooter" style="Position: fest; unten: 0px; Breite: 100 %; Höhe: 85px; Hintergrund: keiner, Scrollen wiederholen 0px 0px rgb(0, 120, 216);"> <p id="myFootText">Wissen verändert das Schicksal, Programmierer retten Leben</p> <p id="myFootCopy">ohmygirl@2014</p> </div> 2. Gleichzeitig werden die störenden Werbelinks und Werbebanner am Ende des Artikels entfernt. Es sieht viel sauberer aus. Der CSS-Code lautet: Code kopieren Der Code lautet wie folgt:/* werben */ #site_nav_under,#ad_under_post_holder,#under_post_news,#google_ad_c2,#under_post_kb{ Breite: 0; Höhe: 0; Anzeige: keine; Überlauf: versteckt; } 3. Der Kommentar-Button am unteren Ende des Artikels ist in seiner Position und Größe ungünstig platziert, er steht zu weit links und die anklickbare Fläche ist zu klein. Hier sind zusammen gepostet: Code kopieren Der Code lautet wie folgt:#RecentCommentsBlock li { Rand: 0; Breite: 275px; } #RecentCommentsBlock li.recent_comment_body { Randradius: 0; Rand: 0; } #RecentCommentsBlock li.recent_comment_title { Rahmenradius: 5px 5px 0 0; Rand: 3px 0 0; } #RecentCommentsBlock li.recent_comment_author { Rahmenradius: 0 0 5px 5px; Rand: 0; } .desc_img{ Breite: 75px; maximale Breite: 75px; } #Blog-Kalender{ Hintergrund: weiß; } /* Kommentar */ div.Kommentarformular{ Rand unten: 100px; } #Kommentarformulartitel { Hintergrund: URL("<a href="http://static.cnblogs.com/images/icon_addcomment.gif">http://static.cnblogs.com/images/icon_addcomment.gif</a>") kein wiederholtes Scrollen 0 2px; Farbe: #0078d8; Schriftgröße: 14px; } div.Kommentarform p{ Rand unten: 10px; } .comment_btn { Höhe: 35px; Breite: 90px; Hintergrund: keine Wiederholung, Scrollen 0 0 #0078d8; Rand: 0 keine; Rahmenradius: 5px; Farbe: weiß; Cursor:Zeiger; } .comment_btn:hover{ Hintergrund: #317ef3; } #commentbox_opt,#commentbox_opt + p { Textausrichtung: zentriert; } #tbCommentBody{ Breite: 100 %; Größenänderung: keine; } #tbCommentAuthor,#tbCommentBody{ Rand: 1px durchgezogen #0078d8; } #tbCommentBody:hover{ Rand: 1px durchgezogen #fca021; } #Kommentare > h3 { Hintergrund: keine Wiederholung, Scrollen 0 0 #0078d8; Rahmenradius: 3px; Farbe: weiß; Polsterung: 8px; Grenze:0 keine; Schriftgröße: 14px; } #Kommentare{ Schriftgröße: 13px; } #Kommentare h4{ Rand oben: 10px; } #Kommentare h4 span { Farbe: #6c6351; Schriftgröße: 12px; } .Kommentaraktionen { Rahmen unten: 1px gestrichelt #0078d8; Anzeige: Block; Polsterung unten: 10px; } .blog_comment_body { Farbe: #111; Schriftgröße: 13px; Rand unten: 10px; Rand oben: 10px; } #Kommentarnavigation { Schriftgröße: 14px; Rand oben: 10px; Textausrichtung: rechts; } Abschließend lautet der CSS-Code für das Blog-Thema: Code kopieren Der Code lautet wie folgt:/* Kopfzeile */ #header{ Rand: 1px durchgezogen #044e97; Hintergrund: #0078d8 wiederholen; Kastenschatten: 0 0 5px; } h1{ Hintergrund: keiner; Rahmen unten: 0 keine; } #hauptsächlich{ Rand oben: 5px; Rand rechts: 0 keine; Mindesthöhe: 1040px; } #Header1_HeaderTitle{ Farbe: weiß; Schriftstärke: fett; Schriftgröße: 24px; Textschatten: 1px 5px 1px #000; } #Header1_HeaderTitle:hover{ Farbe: #fca021; } #Slogan{ Farbe: weiß; } p.Datum{ Hintergrund: keine Wiederholung, Scrollen 0 0 #0078d8; Rahmen unten: 1px durchgezogen #aaa; Rahmenradius: 5px; Farbe: weiß; Schriftgröße: 14px; Schriftstärke: fett; Rand: 10px 10px 0 50px; Polsterung: 10px; } .postFoot, p.postFoot{ Polsterung unten: 2px; Rahmen unten: 1px durchgezogen #0078d8; } .postTitle{ Polsterung: 5px 0; } .postTitle a{ Schriftgröße: 15px; Polsterung: 2px 0; } .post h2{ Rahmen unten: 1px gestrichelt #0078d8; Schriftgröße: 1em; Rand oben: 10px; Polsterung: 0 0 10px; } .c_b_p_desc_readmore:hover{ Farbe: #faa123; } #cb_post_title_url{ Schriftgröße: 18px; } #MeineSignatur{ Rand: 1px gestrichelt #0078d8; Anzeige: Block; Polsterung: 5px; } #grüner_kanal{ Rand: 1px gestrichelt #0078d8; } /* rechtes Menü */ #rechtesMenü{ Rand: 1px durchgezogen #0078d8; Hintergrund: #0078d8; Rahmenradius: 10px; } #rechtesMenü ul{ Hintergrund: weiß; } #rechtesMenü li{ Hintergrund: keine Wiederholung, Scrollen 0 0 #3385ff; Rand: 1px durchgezogen #3385ff; Rahmenradius: 5px; Farbe: weiß; Rand: 10px; Polsterung: 5px; Breite: 150px; } #rechtesMenü li a{ Farbe: weiß; Polsterung links: 10px; } #rechtesMenü li:hover{ Hintergrund: #317ef3; } #rechtesMenü h3{ Farbe: weiß; Polsterung: 2px 0 5px 10px; Schriftgröße: 18px; Grenze:0 keine; } #Blog-Kalender{ Hintergrund: weiß; } div.Kommentarformular{ Rand unten: 100px; } /* werben */ #site_nav_under,#ad_under_post_holder,#under_post_news,#google_ad_c2,#under_post_kb{ Breite: 0; Höhe: 0; Anzeige: keine; Überlauf: versteckt; } /* Kalender */ .Cal{ Grenze:0 keine; Breite: 100 %; Höhe: 200px; Schriftgröße: 14px; } .CalTitle{ Schriftgröße: 15px; } .CalTodayDay{ Hintergrund: #0078d8; } .CalTodayDay au{ Farbe: #fc6700; Textdekoration: keine; } |
<<: Informationen zur Auswahl des Uhrzeit-, Datums- und Zeichenfolgentyps in MySQL
>>: Linux-Systemreparaturmodus (Einzelbenutzermodus)
Welche Probleme löst MySQL ROLE? Wenn Sie ein DBA...
In diesem Artikel wird der spezifische Code für J...
In diesem Artikel wird der spezifische Code von j...
Das CentOS-Projekt, ein 100 % kompatibler Neuaufb...
MySQL kann nicht nur über das Netzwerk, sondern a...
In diesem Artikel wird der spezifische Code von J...
Inhaltsverzeichnis Vorherige Wörter Synchron und ...
Verwenden von UNION Die meisten SQL-Abfragen best...
Inhaltsverzeichnis 1. Nachfrage 2. Datenbankdesig...
Vorwort Beim Schreiben von Front-End-Code kommt m...
Tomcat unter Linux starten und herunterfahren Sta...
Ich entwickle derzeit eine Video- und Tool-App, ä...
Ich habe meinen Raspberry Pi-Server vor zwei Tage...
Fremdschlüssel Abfrage, bei welchen Tabellen der ...
Heute werden wir uns ansehen, warum es zu Master-...