DHTML, XHTML, HTML, Basic HTML5 and CSS3 Posts are listed here
Based on the percentage star Rating fill it with different color.
While working in one of my project used it and fork it in my codepen.
CodePen Url:
Star Rating
Embeded Codepen:
See the Pen
Star Rating
by Karthikeyan (@karthikeyan) on CodePen 1
Courtesy:
https://github.com/bkarthikeyan1988/codepen-files/blob/master/info.txt
About
Courtesy/Reference:
https://codepen.io/aurer/pen/jEGbA
CodePen Url:
SVG Loading Icons
Embeded Codepen:
See the Pen
SVG Loading Icons
by Karthikeyan (@karthikeyan) on CodePen 1
Courtesy:
https://github.com/bkarthikeyan1988/codepen-files/blob/master/info.txt
About
In this one I concentrate only on the HTML5 elements alone used lot of CSS for good look and view purpose.
CodePen Url:
HTML5 Modal Form
Embeded Codepen:
See the Pen
HTML5 Modal Form
by Karthikeyan (@karthikeyan) on CodePen 1
Courtesy:
https://github.com/bkarthikeyan1988/codepen-files/blob/master/info.txt
About
For the skill set rating instead of using the star tried using the different symbols like Hexagon Rating.
Based on the percentage same like star Rating fill it with different color.
Used Site Example:
Karthikeyan Resume
CodePen Url:
Hexagon Rating
Embeded Codepen:
See the Pen
Hexagon Ratin
by Karthikeyan (@karthikeyan) on CodePen 1
Courtesy:
https://github.com/bkarthikeyan1988/codepen-files/blob/master/info.txt
About
Created the fixed menu blocks with HTML CSS for theme switcher CV Site
Used the css3 transition effects.
Used Site Example:
Karthikeyan CV
CodePen Url:
CSS3 Fixed Transition Menu
Embeded Codepen:
See the Pen
CSS3 Fixed Transition Menu
by Karthikeyan (@karthikeyan) on CodePen 1
Courtesy:
https://github.com/bkarthikeyan1988/codepen-files/blob/master/info.txt
About
Created the blocks with HTML CSS for my other main site links CV Site
Used CSS3 concepts for rotate and border-radius etc.
Used Site Example:
Karthikeyan CV in more tabs/link.
CodePen Url:
CSS Different Shape Blocks
Embeded Codepen:
See the Pen
CSS3 Block
by Karthikeyan (@karthikeyan) on CodePen 1
Courtesy:
https://github.com/bkarthikeyan1988/codepen-files/blob/master/info.txt
About
This code explain about the toggle button with the checkbox.
With pure CSS able to achieve the switch effect of the checkbox using pseudo elements, pseudo classes.
CodePen Url:
CSS Toggle Button
Embeded Codepen:
See the Pen
CSS Toggle Button
by Karthikeyan (@karthikeyan) on CodePen 1
Courtesy:
https://github.com/bkarthikeyan1988/codepen-files/blob/master/info.txt
About
HTML CSS Vertical Bar Graph to mention the skill set aboout my skills for my CV Site
Refences:
https://www.hongkiat.com/blog/data-visualization-with-css-graphs-charts-and-more/
Used Site Example:
Karthikeyan CV Blue Theme
CodePen Url:
CSS Vertical Graph
Embeded Codepen:
See the Pen
CSS Vertical Graph
by Karthikeyan (@karthikeyan) on CodePen 1
Courtesy:
https://github.com/bkarthikeyan1988/codepen-files/blob/master/info.txt
About
HTML CSS Horizontal Bar Graph to mention the skill set aboout my skills for my CV Site
Refences:
https://www.hongkiat.com/blog/data-visualization-with-css-graphs-charts-and-more/
Used Site Example:
Karthikeyan CV
CodePen Url:
CSS Scale View
Embeded Codepen:
See the Pen
CSS Scale View
by Karthikeyan (@karthikeyan) on CodePen 1
Courtesy:
https://github.com/bkarthikeyan1988/codepen-files/blob/master/info.txt
About
CodePen Url:
CSS Off Canvas Menu
Embeded Codepen:
See the Pen
CSS Offcanvas Menu
by Karthikeyan (@karthikeyan) on CodePen 1
Courtesy:
https://github.com/bkarthikeyan1988/codepen-files/blob/master/info.txt
About