Best Web Development Tutorials For Beginners

W3schools

https://www.w3schools.com

W3Schools is optimized for learning, testing, and training. Examples might be simplified to improve reading and basic understanding.

TutorialsPoint

https://www.tutorialspoint.com/

Free tutorials and reference manuals with examples for Kubernetes, Spring JDBC, Java Concurrency, Gerrit, Spring AOP, Spring MVC, Apache Solr, Excel Power View, Sencha Touch, Tex Commands, Agile Testing, Apache Tajo, C++ Library, MariaDB, SAP QM, SAP SOLMAN, SAP SCM, MS Access, KoaJS, OAuth2.0, Scrapy, SAP CCA, SAP PM, SAPUI5, Cognos, Internet of Things, Rural Marketing, Trampolining, Golf, Angular2, Framework7, Arduino, CherryPy, Firebase, SAP C4C, SAP Dashboard, SAP PI, ExpressJS, Design Thinking, Internet Security, PyGTK, Apache Drill, Excel Charts, Elastic Search, Computer Security, Extreme Programming, Behavior Driven Development, Conversion Rate Optimization, SAP Basis, Business Law, Kanban, Erlang, SAP Payroll, ASP.Net WP, PouchDB, MFC, SAP HR, Yii, Clojure, Aurelia, CoffeeScript, CPanel, Laravel, SAP Webi, MS SQL Server, pinterest, Indian Polity, Windows10, Teradata

CSS Tricks

https://css-tricks.com

Tips, Tricks, and Techniques on using Cascading Style Sheets.

Codrops

https://tympanus.net/codrops/

Codrops is a web design and development blog that publishes articles and tutorials about the latest web trends, techniques and new possibilities.

GitHub

https://github.com/

GitHub is a web-based Git or version control repository and Internet hosting service. It is mostly used for code. It offers all of the distributed version control and source code management functionality of Git as well as adding its own features.

Stack Overflow

https://stackoverflow.com/

Stack Overflow is the largest online community for programmers to learn, share their knowledge, and advance their careers.

Advertisements

CSS Tips : Any web developer should know

I’ve completed many html project and here i am share some basic tips that should know the developer.

  • Habit to write the css within a line single line

    /* Bad */
    .heading {
    font-size:20px;
    color:#000;
    padding-bottom:10px;
    margin-top:20px;
    }
    					
    /* Good */
    .heading { font-size:20px; color:#000; padding-bottom:10px; margin-top:20px; }
    			

  • Take care about the missing the bracket, semicolumn

    .heading {
    font-size:20px;
    color:#000 //bad
    padding-bottom:10px;
    margin-top:20px;
    }
    			

  • Color code can be use with three letter or six.

    /* good */
    .heading { color:#000; background-color:#dddddd; }
    
    /* bad */
    .heading { color:#0000; }			
    			

  • Avoid the use of !important

    Increase the precedency rathar then putting to important

  • Try to use the separate properties for background.

    /* good */
    .heading { background-color: #000; background-repeat: no-repeat; background-image:url(); background-position:center center; }
    
    /* bad */
    .heading { background: <background-color> <background-image> <background-position> }
    			

  • Give overlay of image with background-color

    .overlay { background-color:rgba(0,0,0,0.5); }
    			

  • Media query should be write after the main style to overwrite the style

    /* Main Style */
    .css { color:rgba(0,0,0,0); }
    
    /* Media Style */
    @media (max-width:450px){
    	.css { color: #ddd; }
    }										
    			

  • Clear the floating

    .clear { clear:both; }
    .p-left { float:left; }
    <div class="p-left"></div>
    <div class="p-left"></div>
    <div class="clear"></div>